You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@druid.apache.org by vo...@apache.org on 2024/11/18 23:29:07 UTC
(druid) 32/42: misc fixes
This is an automated email from the ASF dual-hosted git repository.
vogievetsky pushed a commit to branch segment_timeline2
in repository https://gitbox.apache.org/repos/asf/druid.git
commit 06562491fda88a56d65c2146b9f2a4b8cf3cdc7b
Author: Vadim Ogievetsky <va...@ogievetsky.com>
AuthorDate: Fri Nov 8 11:51:31 2024 -0800
misc fixes
---
web-console/src/components/auto-form/auto-form.tsx | 1 -
.../src/components/rule-editor/rule-editor.scss | 4 ++
.../src/components/rule-editor/rule-editor.tsx | 2 +-
.../segment-timeline/segment-bar-chart-render.scss | 1 +
.../segment-timeline/segment-bar-chart-render.tsx | 2 +-
.../segment-timeline/segment-timeline.tsx | 55 +++++++++++-----------
.../table-clickable-cell/table-clickable-cell.tsx | 5 +-
.../views/datasources-view/datasources-view.tsx | 18 +++++--
.../src/views/lookups-view/lookups-view.tsx | 1 +
.../src/views/segments-view/segments-view.tsx | 6 +++
.../views/supervisors-view/supervisors-view.tsx | 5 +-
web-console/src/views/tasks-view/tasks-view.tsx | 1 +
.../execution-stages-pane.tsx | 2 +-
13 files changed, 63 insertions(+), 40 deletions(-)
diff --git a/web-console/src/components/auto-form/auto-form.tsx b/web-console/src/components/auto-form/auto-form.tsx
index 4c51d2cbf5a..7026ca5d5dc 100644
--- a/web-console/src/components/auto-form/auto-form.tsx
+++ b/web-console/src/components/auto-form/auto-form.tsx
@@ -539,7 +539,6 @@ export class AutoForm<T extends Record<string, any>> extends React.PureComponent
text={showMore ? 'Show less' : 'Show more'}
rightIcon={showMore ? IconNames.CHEVRON_UP : IconNames.CHEVRON_DOWN}
minimal
- fill
onClick={() => {
this.setState(({ showMore }) => ({ showMore: !showMore }));
}}
diff --git a/web-console/src/components/rule-editor/rule-editor.scss b/web-console/src/components/rule-editor/rule-editor.scss
index e5757bc2999..cb021e85c01 100644
--- a/web-console/src/components/rule-editor/rule-editor.scss
+++ b/web-console/src/components/rule-editor/rule-editor.scss
@@ -28,4 +28,8 @@
.include-future {
margin-left: 15px;
}
+
+ .rule-detail {
+ border: 1px solid rgba(255, 255, 255, 0.15);
+ }
}
diff --git a/web-console/src/components/rule-editor/rule-editor.tsx b/web-console/src/components/rule-editor/rule-editor.tsx
index 0181e4341ba..8cea5321cfd 100644
--- a/web-console/src/components/rule-editor/rule-editor.tsx
+++ b/web-console/src/components/rule-editor/rule-editor.tsx
@@ -170,7 +170,7 @@ export const RuleEditor = React.memo(function RuleEditor(props: RuleEditorProps)
</div>
<Collapse isOpen={isOpen}>
- <Card elevation={2}>
+ <Card className="rule-detail" elevation={2}>
<FormGroup>
<ControlGroup>
<HTMLSelect
diff --git a/web-console/src/components/segment-timeline/segment-bar-chart-render.scss b/web-console/src/components/segment-timeline/segment-bar-chart-render.scss
index 7667dc5b1f3..75da5e4e666 100644
--- a/web-console/src/components/segment-timeline/segment-bar-chart-render.scss
+++ b/web-console/src/components/segment-timeline/segment-bar-chart-render.scss
@@ -109,6 +109,7 @@
padding-left: 2px;
top: 0;
height: 100%;
+ text-overflow: ellipsis;
}
}
diff --git a/web-console/src/components/segment-timeline/segment-bar-chart-render.tsx b/web-console/src/components/segment-timeline/segment-bar-chart-render.tsx
index 7bdef7e2db2..7ba310048c0 100644
--- a/web-console/src/components/segment-timeline/segment-bar-chart-render.tsx
+++ b/web-console/src/components/segment-timeline/segment-bar-chart-render.tsx
@@ -458,7 +458,7 @@ export const SegmentBarChartRender = function SegmentBarChartRender(
backgroundColor: colors[i % colors.length],
}}
>
- {width > 90 ? title : undefined}
+ {title}
</div>
);
}
diff --git a/web-console/src/components/segment-timeline/segment-timeline.tsx b/web-console/src/components/segment-timeline/segment-timeline.tsx
index d4294750a7b..065e8e5a5ae 100644
--- a/web-console/src/components/segment-timeline/segment-timeline.tsx
+++ b/web-console/src/components/segment-timeline/segment-timeline.tsx
@@ -245,7 +245,31 @@ export const SegmentTimeline = function SegmentTimeline(props: SegmentTimelinePr
/>
</Popover>
<div className="expander" />
-
+ <ButtonGroup>
+ <Button
+ icon={IconNames.CARET_LEFT}
+ data-tooltip={
+ previousDateRange && `Previous time period\n${formatDateRange(previousDateRange)}`
+ }
+ small
+ disabled={!previousDateRange}
+ onClick={() => setDateRange(previousDateRange)}
+ />
+ <Button
+ icon={IconNames.ZOOM_OUT}
+ data-tooltip={zoomedOutDateRange && `Zoom out\n${formatDateRange(zoomedOutDateRange)}`}
+ small
+ disabled={!zoomedOutDateRange}
+ onClick={() => setDateRange(zoomedOutDateRange)}
+ />
+ <Button
+ icon={IconNames.CARET_RIGHT}
+ data-tooltip={nextDateRange && `Next time period\n${formatDateRange(nextDateRange)}`}
+ small
+ disabled={!nextDateRange}
+ onClick={() => setDateRange(nextDateRange)}
+ />
+ </ButtonGroup>
<ButtonGroup>
{SHOWN_DURATION_OPTIONS.map((d, i) => {
const dr = getDateRange(d);
@@ -284,38 +308,15 @@ export const SegmentTimeline = function SegmentTimeline(props: SegmentTimelinePr
<Button
icon={IconNames.CALENDAR}
text={
- effectiveDateRange ? formatDateRange(effectiveDateRange) : '????-??-?? → ????-??-??'
+ effectiveDateRange
+ ? formatDateRange(effectiveDateRange)
+ : `Loading datasource date range`
}
small
data-tooltip={showCustomDatePicker ? undefined : `Select a custom date range`}
/>
</Popover>
</ButtonGroup>
- <ButtonGroup>
- <Button
- icon={IconNames.CARET_LEFT}
- data-tooltip={
- previousDateRange && `Previous time period\n${formatDateRange(previousDateRange)}`
- }
- small
- disabled={!previousDateRange}
- onClick={() => setDateRange(previousDateRange)}
- />
- <Button
- icon={IconNames.ZOOM_OUT}
- data-tooltip={zoomedOutDateRange && `Zoom out\n${formatDateRange(zoomedOutDateRange)}`}
- small
- disabled={!zoomedOutDateRange}
- onClick={() => setDateRange(zoomedOutDateRange)}
- />
- <Button
- icon={IconNames.CARET_RIGHT}
- data-tooltip={nextDateRange && `Next time period\n${formatDateRange(nextDateRange)}`}
- small
- disabled={!nextDateRange}
- onClick={() => setDateRange(nextDateRange)}
- />
- </ButtonGroup>
</div>
<ResizeSensor
onResize={(entries: ResizeObserverEntry[]) => {
diff --git a/web-console/src/components/table-clickable-cell/table-clickable-cell.tsx b/web-console/src/components/table-clickable-cell/table-clickable-cell.tsx
index aec706a50fc..38c69e297e0 100644
--- a/web-console/src/components/table-clickable-cell/table-clickable-cell.tsx
+++ b/web-console/src/components/table-clickable-cell/table-clickable-cell.tsx
@@ -28,7 +28,7 @@ export interface TableClickableCellProps {
className?: string;
onClick: MouseEventHandler<any>;
hoverIcon?: IconName;
- title?: string;
+ tooltip?: string;
disabled?: boolean;
children?: ReactNode;
}
@@ -36,12 +36,13 @@ export interface TableClickableCellProps {
export const TableClickableCell = React.memo(function TableClickableCell(
props: TableClickableCellProps,
) {
- const { className, onClick, hoverIcon, disabled, children, ...rest } = props;
+ const { className, onClick, hoverIcon, disabled, children, tooltip, ...rest } = props;
return (
<div
className={classNames('table-clickable-cell', className, { disabled })}
onClick={disabled ? undefined : onClick}
+ data-tooltip={tooltip}
{...rest}
>
{children}
diff --git a/web-console/src/views/datasources-view/datasources-view.tsx b/web-console/src/views/datasources-view/datasources-view.tsx
index 30f17061d4f..9891368e585 100644
--- a/web-console/src/views/datasources-view/datasources-view.tsx
+++ b/web-console/src/views/datasources-view/datasources-view.tsx
@@ -245,6 +245,7 @@ interface DatasourcesAndDefaultRules {
interface RetentionDialogOpenOn {
readonly datasource: string;
readonly rules: Rule[];
+ readonly defaultRules: Rule[];
}
interface CompactionConfigDialogOpenOn {
@@ -927,6 +928,7 @@ GROUP BY 1, 2`;
retentionDialogOpenOn: {
datasource: '_default',
rules: defaultRules,
+ defaultRules,
},
};
});
@@ -1036,10 +1038,13 @@ GROUP BY 1, 2`;
icon: IconNames.AUTOMATIC_UPDATES,
title: 'Edit retention rules',
onAction: () => {
+ const defaultRules = this.state.datasourcesAndDefaultRulesState.data?.defaultRules;
+ if (!defaultRules) return;
this.setState({
retentionDialogOpenOn: {
datasource,
rules: rules || [],
+ defaultRules,
},
});
},
@@ -1103,9 +1108,8 @@ GROUP BY 1, 2`;
private renderRetentionDialog() {
const { capabilities } = this.props;
- const { retentionDialogOpenOn, datasourcesAndDefaultRulesState } = this.state;
- const defaultRules = datasourcesAndDefaultRulesState.data?.defaultRules;
- if (!retentionDialogOpenOn || !defaultRules) return;
+ const { retentionDialogOpenOn } = this.state;
+ if (!retentionDialogOpenOn) return;
return (
<RetentionDialog
@@ -1113,7 +1117,7 @@ GROUP BY 1, 2`;
rules={retentionDialogOpenOn.rules}
capabilities={capabilities}
onEditDefaults={this.editDefaultRules}
- defaultRules={defaultRules}
+ defaultRules={retentionDialogOpenOn.defaultRules}
onCancel={() => this.setState({ retentionDialogOpenOn: undefined })}
onSave={this.saveRules}
/>
@@ -1205,6 +1209,7 @@ GROUP BY 1, 2`;
<TableClickableCell
onClick={() => this.onDetail(original)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
+ tooltip="Show detail"
>
{showSegmentTimeline ? (
<>
@@ -1334,7 +1339,7 @@ GROUP BY 1, 2`;
<TableClickableCell
onClick={() => goToTasks(original.datasource)}
hoverIcon={IconNames.ARROW_TOP_RIGHT}
- title="Go to tasks"
+ tooltip="Go to tasks"
>
{formatRunningTasks(runningTasks)}
</TableClickableCell>
@@ -1514,6 +1519,7 @@ GROUP BY 1, 2`;
if (!compaction) return;
return (
<TableClickableCell
+ tooltip="Open compaction configuration"
disabled={!compaction}
onClick={() => {
if (!compaction) return;
@@ -1630,6 +1636,7 @@ GROUP BY 1, 2`;
return (
<TableClickableCell
+ tooltip="Open retention (load rule) configuration"
disabled={!defaultRules}
onClick={() => {
if (!defaultRules) return;
@@ -1637,6 +1644,7 @@ GROUP BY 1, 2`;
retentionDialogOpenOn: {
datasource,
rules,
+ defaultRules,
},
});
}}
diff --git a/web-console/src/views/lookups-view/lookups-view.tsx b/web-console/src/views/lookups-view/lookups-view.tsx
index f9d188078a7..99c3d2b03f3 100644
--- a/web-console/src/views/lookups-view/lookups-view.tsx
+++ b/web-console/src/views/lookups-view/lookups-view.tsx
@@ -387,6 +387,7 @@ export class LookupsView extends React.PureComponent<LookupsViewProps, LookupsVi
width: 200,
Cell: ({ value, original }) => (
<TableClickableCell
+ tooltip="Show detail"
onClick={() => this.onDetail(original)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
>
diff --git a/web-console/src/views/segments-view/segments-view.tsx b/web-console/src/views/segments-view/segments-view.tsx
index 6f3cd468360..3233c587a4e 100644
--- a/web-console/src/views/segments-view/segments-view.tsx
+++ b/web-console/src/views/segments-view/segments-view.tsx
@@ -577,6 +577,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
filterable: allowGeneralFilter,
Cell: row => (
<TableClickableCell
+ tooltip="Show detail"
onClick={() => this.onDetail(row.value, row.row.datasource)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
>
@@ -688,6 +689,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
return (
<TableClickableCell
className="range-detail"
+ tooltip="Show full shardSpec"
onClick={onShowFullShardSpec}
hoverIcon={IconNames.EYE_OPEN}
>
@@ -704,6 +706,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
return (
<TableClickableCell
className="range-detail"
+ tooltip="Show full shardSpec"
onClick={onShowFullShardSpec}
hoverIcon={IconNames.EYE_OPEN}
>
@@ -725,6 +728,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
if (!Array.isArray(partitionDimensions)) return JSONBig.stringify(value);
return (
<TableClickableCell
+ tooltip="Show full shardSpec"
onClick={onShowFullShardSpec}
hoverIcon={IconNames.EYE_OPEN}
>
@@ -742,6 +746,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
case 'tombstone':
return (
<TableClickableCell
+ tooltip="Show full shardSpec"
onClick={onShowFullShardSpec}
hoverIcon={IconNames.EYE_OPEN}
>
@@ -752,6 +757,7 @@ export class SegmentsView extends React.PureComponent<SegmentsViewProps, Segment
default:
return (
<TableClickableCell
+ tooltip="Show full shardSpec"
onClick={onShowFullShardSpec}
hoverIcon={IconNames.EYE_OPEN}
>
diff --git a/web-console/src/views/supervisors-view/supervisors-view.tsx b/web-console/src/views/supervisors-view/supervisors-view.tsx
index 334339bc7cc..045ec45e1f8 100644
--- a/web-console/src/views/supervisors-view/supervisors-view.tsx
+++ b/web-console/src/views/supervisors-view/supervisors-view.tsx
@@ -715,6 +715,7 @@ export class SupervisorsView extends React.PureComponent<
show: visibleColumns.shown('Supervisor ID'),
Cell: ({ value, original }) => (
<TableClickableCell
+ tooltip="Show detail"
onClick={() => this.onSupervisorDetail(original)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
>
@@ -811,9 +812,9 @@ export class SupervisorsView extends React.PureComponent<
}
return (
<TableClickableCell
+ tooltip="Go to tasks"
onClick={() => goToTasks(original.supervisor_id, `index_${original.type}`)}
hoverIcon={IconNames.ARROW_TOP_RIGHT}
- title="Go to tasks"
>
{label}
</TableClickableCell>
@@ -923,9 +924,9 @@ export class SupervisorsView extends React.PureComponent<
if (!value) return null;
return (
<TableClickableCell
+ tooltip="Show errors"
onClick={() => this.onSupervisorDetail(original)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
- title="See errors"
>
{pluralIfNeeded(value.length, 'error')}
</TableClickableCell>
diff --git a/web-console/src/views/tasks-view/tasks-view.tsx b/web-console/src/views/tasks-view/tasks-view.tsx
index 0e44c96413f..5142da787cd 100644
--- a/web-console/src/views/tasks-view/tasks-view.tsx
+++ b/web-console/src/views/tasks-view/tasks-view.tsx
@@ -372,6 +372,7 @@ ORDER BY
width: 440,
Cell: ({ value, original }) => (
<TableClickableCell
+ tooltip="Show detail"
onClick={() => this.onTaskDetail(original)}
hoverIcon={IconNames.SEARCH_TEMPLATE}
>
diff --git a/web-console/src/views/workbench-view/execution-stages-pane/execution-stages-pane.tsx b/web-console/src/views/workbench-view/execution-stages-pane/execution-stages-pane.tsx
index 5ea2e97bb09..d7c447d090c 100644
--- a/web-console/src/views/workbench-view/execution-stages-pane/execution-stages-pane.tsx
+++ b/web-console/src/views/workbench-view/execution-stages-pane/execution-stages-pane.tsx
@@ -251,7 +251,7 @@ export const ExecutionStagesPane = React.memo(function ExecutionStagesPane(
return (
<TableClickableCell
hoverIcon={IconNames.SHARE}
- data-tooltip={`Go to task: ${taskId}`}
+ tooltip={`Go to task: ${taskId}`}
onClick={() => {
goToTask(taskId);
}}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@druid.apache.org
For additional commands, e-mail: commits-help@druid.apache.org