This is an automated email from the ASF dual-hosted git repository.
fjy pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-druid.git
The following commit(s) were added to refs/heads/master by this push:
new 248e075 Web console: Simplify task and supervisor detail displays
(#7848)
248e075 is described below
commit 248e075e24eac15b840a7aca4b86abd37342ae3b
Author: Vadim Ogievetsky <[email protected]>
AuthorDate: Fri Jun 7 11:02:45 2019 -0700
Web console: Simplify task and supervisor detail displays (#7848)
* simplify detail display
* update tests
---
web-console/src/components/show-json/show-json.tsx | 9 ++--
.../supervisor-table-action-dialog.spec.tsx.snap | 24 +++++-----
.../supervisor-table-action-dialog.tsx | 50 +++++++++++++++-----
.../task-table-action-dialog.spec.tsx.snap | 24 +++++-----
.../task-table-action-dialog.tsx | 53 +++++++++++++++++-----
5 files changed, 109 insertions(+), 51 deletions(-)
diff --git a/web-console/src/components/show-json/show-json.tsx
b/web-console/src/components/show-json/show-json.tsx
index 2799532..91cdf6d 100644
--- a/web-console/src/components/show-json/show-json.tsx
+++ b/web-console/src/components/show-json/show-json.tsx
@@ -29,6 +29,7 @@ import './show-json.scss';
export interface ShowJsonProps extends React.Props<any> {
endpoint: string;
+ transform?: (x: any) => any;
downloadFilename?: string;
}
@@ -47,12 +48,14 @@ export class ShowJson extends
React.PureComponent<ShowJsonProps, ShowJsonState>
}
private getJsonInfo = async (): Promise<void> => {
- const { endpoint } = this.props;
+ const { endpoint, transform } = this.props;
+
try {
const resp = await axios.get(endpoint);
- const data = resp.data;
+ let data = resp.data;
+ if (transform) data = transform(data);
this.setState({
- jsonValue: typeof (data) === 'string' ? data : JSON.stringify(data,
undefined, 2)
+ jsonValue: typeof data === 'string' ? data : JSON.stringify(data,
undefined, 2)
});
} catch (e) {
this.setState({
diff --git
a/web-console/src/dialogs/supervisor-table-action-dialog/__snapshots__/supervisor-table-action-dialog.spec.tsx.snap
b/web-console/src/dialogs/supervisor-table-action-dialog/__snapshots__/supervisor-table-action-dialog.spec.tsx.snap
index f216fcf..84017de 100644
---
a/web-console/src/dialogs/supervisor-table-action-dialog/__snapshots__/supervisor-table-action-dialog.spec.tsx.snap
+++
b/web-console/src/dialogs/supervisor-table-action-dialog/__snapshots__/supervisor-table-action-dialog.spec.tsx.snap
@@ -63,20 +63,20 @@ exports[`supervisor table action dialog matches snapshot
1`] = `
type="button"
>
<span
- class="bp3-icon bp3-icon-align-left"
- icon="align-left"
+ class="bp3-icon bp3-icon-dashboard"
+ icon="dashboard"
>
<svg
- data-icon="align-left"
+ data-icon="dashboard"
height="20"
viewBox="0 0 20 20"
width="20"
>
<desc>
- align-left
+ dashboard
</desc>
<path
- d="M1 7h10c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1
1s.45 1 1 1zm0-4h18c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1zm14
14H1c-.55 0-1 .45-1 1s.45 1 1 1h14c.55 0 1-.45 1-1s-.45-1-1-1zm4-8H1c-.55 0-1
.45-1 1s.45 1 1 1h18c.55 0 1-.45 1-1s-.45-1-1-1zM1 15h6c.55 0 1-.45
1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1z"
+ d="M6 5c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zM4
9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm6-4c.55 0 1-.45
1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm0-5C4.48 0 0 4.48 0 10s4.48 10 10 10
10-4.48 10-10S15.52 0 10 0zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58
8-8 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm-8 5c0 1.1.9 2 2
2s2-.9 2-2c0-.33-2-8-2-8s-2 7.67-2 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45
1-1-.45-1-1-1z"
fill-rule="evenodd"
/>
</svg>
@@ -84,7 +84,7 @@ exports[`supervisor table action dialog matches snapshot 1`]
= `
<span
class="bp3-button-text"
>
- Payload
+ Status
</span>
</button>
<button
@@ -92,20 +92,20 @@ exports[`supervisor table action dialog matches snapshot
1`] = `
type="button"
>
<span
- class="bp3-icon bp3-icon-dashboard"
- icon="dashboard"
+ class="bp3-icon bp3-icon-align-left"
+ icon="align-left"
>
<svg
- data-icon="dashboard"
+ data-icon="align-left"
height="20"
viewBox="0 0 20 20"
width="20"
>
<desc>
- dashboard
+ align-left
</desc>
<path
- d="M6 5c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zM4
9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm6-4c.55 0 1-.45
1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm0-5C4.48 0 0 4.48 0 10s4.48 10 10 10
10-4.48 10-10S15.52 0 10 0zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58
8-8 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm-8 5c0 1.1.9 2 2
2s2-.9 2-2c0-.33-2-8-2-8s-2 7.67-2 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45
1-1-.45-1-1-1z"
+ d="M1 7h10c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1
1s.45 1 1 1zm0-4h18c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1zm14
14H1c-.55 0-1 .45-1 1s.45 1 1 1h14c.55 0 1-.45 1-1s-.45-1-1-1zm4-8H1c-.55 0-1
.45-1 1s.45 1 1 1h18c.55 0 1-.45 1-1s-.45-1-1-1zM1 15h6c.55 0 1-.45
1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1z"
fill-rule="evenodd"
/>
</svg>
@@ -113,7 +113,7 @@ exports[`supervisor table action dialog matches snapshot
1`] = `
<span
class="bp3-button-text"
>
- Status
+ Payload
</span>
</button>
<button
diff --git
a/web-console/src/dialogs/supervisor-table-action-dialog/supervisor-table-action-dialog.tsx
b/web-console/src/dialogs/supervisor-table-action-dialog/supervisor-table-action-dialog.tsx
index 8287522..88b7994 100644
---
a/web-console/src/dialogs/supervisor-table-action-dialog/supervisor-table-action-dialog.tsx
+++
b/web-console/src/dialogs/supervisor-table-action-dialog/supervisor-table-action-dialog.tsx
@@ -21,6 +21,7 @@ import * as React from 'react';
import { ShowJson } from '../../components';
import { BasicAction, basicActionsToButtons } from '../../utils/basic-action';
+import { deepGet } from '../../utils/object-change';
import { SideButtonMetaData, TableActionDialog } from
'../table-action-dialog/table-action-dialog';
interface SupervisorTableActionDialogProps extends IDialogProps {
@@ -30,14 +31,14 @@ interface SupervisorTableActionDialogProps extends
IDialogProps {
}
interface SupervisorTableActionDialogState {
- activeTab: 'payload' | 'status' | 'stats' | 'history';
+ activeTab: 'status' | 'payload' | 'stats' | 'history';
}
export class SupervisorTableActionDialog extends
React.PureComponent<SupervisorTableActionDialogProps,
SupervisorTableActionDialogState> {
constructor(props: SupervisorTableActionDialogProps) {
super(props);
this.state = {
- activeTab: 'payload'
+ activeTab: 'status'
};
}
@@ -47,18 +48,18 @@ export class SupervisorTableActionDialog extends
React.PureComponent<SupervisorT
const supervisorTableSideButtonMetadata: SideButtonMetaData[] = [
{
- icon: 'align-left',
- text: 'Payload',
- active: activeTab === 'payload',
- onClick: () => this.setState({ activeTab: 'payload' })
- },
- {
icon: 'dashboard',
text: 'Status',
active: activeTab === 'status',
onClick: () => this.setState({ activeTab: 'status' })
},
{
+ icon: 'align-left',
+ text: 'Payload',
+ active: activeTab === 'payload',
+ onClick: () => this.setState({ activeTab: 'payload' })
+ },
+ {
icon: 'chart',
text: 'Statistics',
active: activeTab === 'stats',
@@ -79,10 +80,35 @@ export class SupervisorTableActionDialog extends
React.PureComponent<SupervisorT
title={`Supervisor: ${supervisorId}`}
bottomButtons={basicActionsToButtons(actions)}
>
- {activeTab === 'payload' && <ShowJson
endpoint={`/druid/indexer/v1/supervisor/${supervisorId}`}
downloadFilename={`supervisor-payload-${supervisorId}.json`}/>}
- {activeTab === 'status' && <ShowJson
endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/status`}
downloadFilename={`supervisor-status-${supervisorId}.json`}/>}
- {activeTab === 'stats' && <ShowJson
endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/stats`}
downloadFilename={`supervisor-stats-${supervisorId}.json`}/>}
- {activeTab === 'history' && <ShowJson
endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/history`}
downloadFilename={`supervisor-history-${supervisorId}.json`}/>}
+ {
+ activeTab === 'status' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/status`}
+ transform={x => deepGet(x, 'payload')}
+ downloadFilename={`supervisor-status-${supervisorId}.json`}
+ />
+ }
+ {
+ activeTab === 'payload' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/supervisor/${supervisorId}`}
+ downloadFilename={`supervisor-payload-${supervisorId}.json`}
+ />
+ }
+ {
+ activeTab === 'stats' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/stats`}
+ downloadFilename={`supervisor-stats-${supervisorId}.json`}
+ />
+ }
+ {
+ activeTab === 'history' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/supervisor/${supervisorId}/history`}
+ downloadFilename={`supervisor-history-${supervisorId}.json`}
+ />
+ }
</TableActionDialog>;
}
}
diff --git
a/web-console/src/dialogs/task-table-action-dialog/__snapshots__/task-table-action-dialog.spec.tsx.snap
b/web-console/src/dialogs/task-table-action-dialog/__snapshots__/task-table-action-dialog.spec.tsx.snap
index babf8c9..8c3e6f2 100644
---
a/web-console/src/dialogs/task-table-action-dialog/__snapshots__/task-table-action-dialog.spec.tsx.snap
+++
b/web-console/src/dialogs/task-table-action-dialog/__snapshots__/task-table-action-dialog.spec.tsx.snap
@@ -63,20 +63,20 @@ exports[`task table action dialog matches snapshot 1`] = `
type="button"
>
<span
- class="bp3-icon bp3-icon-align-left"
- icon="align-left"
+ class="bp3-icon bp3-icon-dashboard"
+ icon="dashboard"
>
<svg
- data-icon="align-left"
+ data-icon="dashboard"
height="20"
viewBox="0 0 20 20"
width="20"
>
<desc>
- align-left
+ dashboard
</desc>
<path
- d="M1 7h10c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1
1s.45 1 1 1zm0-4h18c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1zm14
14H1c-.55 0-1 .45-1 1s.45 1 1 1h14c.55 0 1-.45 1-1s-.45-1-1-1zm4-8H1c-.55 0-1
.45-1 1s.45 1 1 1h18c.55 0 1-.45 1-1s-.45-1-1-1zM1 15h6c.55 0 1-.45
1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1z"
+ d="M6 5c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zM4
9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm6-4c.55 0 1-.45
1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm0-5C4.48 0 0 4.48 0 10s4.48 10 10 10
10-4.48 10-10S15.52 0 10 0zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58
8-8 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm-8 5c0 1.1.9 2 2
2s2-.9 2-2c0-.33-2-8-2-8s-2 7.67-2 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45
1-1-.45-1-1-1z"
fill-rule="evenodd"
/>
</svg>
@@ -84,7 +84,7 @@ exports[`task table action dialog matches snapshot 1`] = `
<span
class="bp3-button-text"
>
- Payload
+ Status
</span>
</button>
<button
@@ -92,20 +92,20 @@ exports[`task table action dialog matches snapshot 1`] = `
type="button"
>
<span
- class="bp3-icon bp3-icon-dashboard"
- icon="dashboard"
+ class="bp3-icon bp3-icon-align-left"
+ icon="align-left"
>
<svg
- data-icon="dashboard"
+ data-icon="align-left"
height="20"
viewBox="0 0 20 20"
width="20"
>
<desc>
- dashboard
+ align-left
</desc>
<path
- d="M6 5c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zM4
9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm6-4c.55 0 1-.45
1-1s-.45-1-1-1-1 .45-1 1 .45 1 1 1zm0-5C4.48 0 0 4.48 0 10s4.48 10 10 10
10-4.48 10-10S15.52 0 10 0zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58
8-8 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1zm-8 5c0 1.1.9 2 2
2s2-.9 2-2c0-.33-2-8-2-8s-2 7.67-2 8zm6-9c-.55 0-1 .45-1 1s.45 1 1 1 1-.45
1-1-.45-1-1-1z"
+ d="M1 7h10c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1
1s.45 1 1 1zm0-4h18c.55 0 1-.45 1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1zm14
14H1c-.55 0-1 .45-1 1s.45 1 1 1h14c.55 0 1-.45 1-1s-.45-1-1-1zm4-8H1c-.55 0-1
.45-1 1s.45 1 1 1h18c.55 0 1-.45 1-1s-.45-1-1-1zM1 15h6c.55 0 1-.45
1-1s-.45-1-1-1H1c-.55 0-1 .45-1 1s.45 1 1 1z"
fill-rule="evenodd"
/>
</svg>
@@ -113,7 +113,7 @@ exports[`task table action dialog matches snapshot 1`] = `
<span
class="bp3-button-text"
>
- Status
+ Payload
</span>
</button>
<button
diff --git
a/web-console/src/dialogs/task-table-action-dialog/task-table-action-dialog.tsx
b/web-console/src/dialogs/task-table-action-dialog/task-table-action-dialog.tsx
index 986a1aa..d464ffe 100644
---
a/web-console/src/dialogs/task-table-action-dialog/task-table-action-dialog.tsx
+++
b/web-console/src/dialogs/task-table-action-dialog/task-table-action-dialog.tsx
@@ -21,6 +21,7 @@ import * as React from 'react';
import { ShowJson, ShowLog } from '../../components';
import { BasicAction, basicActionsToButtons } from '../../utils/basic-action';
+import { deepGet } from '../../utils/object-change';
import { SideButtonMetaData, TableActionDialog } from
'../table-action-dialog/table-action-dialog';
interface TaskTableActionDialogProps extends IDialogProps {
@@ -30,14 +31,14 @@ interface TaskTableActionDialogProps extends IDialogProps {
}
interface TaskTableActionDialogState {
- activeTab: 'payload' | 'status' | 'reports' | 'log';
+ activeTab: 'status' | 'payload' | 'reports' | 'log';
}
export class TaskTableActionDialog extends
React.PureComponent<TaskTableActionDialogProps, TaskTableActionDialogState> {
constructor(props: TaskTableActionDialogProps) {
super(props);
this.state = {
- activeTab: 'payload'
+ activeTab: 'status'
};
}
@@ -47,18 +48,18 @@ export class TaskTableActionDialog extends
React.PureComponent<TaskTableActionDi
const taskTableSideButtonMetadata: SideButtonMetaData[] = [
{
- icon: 'align-left',
- text: 'Payload',
- active: activeTab === 'payload',
- onClick: () => this.setState({ activeTab: 'payload' })
- },
- {
icon: 'dashboard',
text: 'Status',
active: activeTab === 'status',
onClick: () => this.setState({ activeTab: 'status' })
},
{
+ icon: 'align-left',
+ text: 'Payload',
+ active: activeTab === 'payload',
+ onClick: () => this.setState({ activeTab: 'payload' })
+ },
+ {
icon: 'comparison',
text: 'Reports',
active: activeTab === 'reports',
@@ -79,10 +80,38 @@ export class TaskTableActionDialog extends
React.PureComponent<TaskTableActionDi
title={`Task: ${taskId}`}
bottomButtons={basicActionsToButtons(actions)}
>
- {activeTab === 'payload' && <ShowJson
endpoint={`/druid/indexer/v1/task/${taskId}`}
downloadFilename={`task-payload-${taskId}.json`}/>}
- {activeTab === 'status' && <ShowJson
endpoint={`/druid/indexer/v1/task/${taskId}/status`}
downloadFilename={`task-status-${taskId}.json`}/>}
- {activeTab === 'reports' && <ShowJson
endpoint={`/druid/indexer/v1/task/${taskId}/reports`}
downloadFilename={`task-reports-${taskId}.json`}/>}
- {activeTab === 'log' && <ShowLog
endpoint={`/druid/indexer/v1/task/${taskId}/log`}
downloadFilename={`task-log-${taskId}.json`} tailOffset={16000}/>}
+ {
+ activeTab === 'status' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/task/${taskId}/status`}
+ transform={x => deepGet(x, 'status')}
+ downloadFilename={`task-status-${taskId}.json`}
+ />
+ }
+ {
+ activeTab === 'payload' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/task/${taskId}`}
+ transform={x => deepGet(x, 'payload')}
+ downloadFilename={`task-payload-${taskId}.json`}
+ />
+ }
+ {
+ activeTab === 'reports' &&
+ <ShowJson
+ endpoint={`/druid/indexer/v1/task/${taskId}/reports`}
+ transform={x => deepGet(x, 'ingestionStatsAndErrors.payload')}
+ downloadFilename={`task-reports-${taskId}.json`}
+ />
+ }
+ {
+ activeTab === 'log' &&
+ <ShowLog
+ endpoint={`/druid/indexer/v1/task/${taskId}/log`}
+ downloadFilename={`task-log-${taskId}.json`}
+ tailOffset={16000}
+ />
+ }
</TableActionDialog>;
}
}
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
