Skip to content

Commit 72b0f23

Browse files
anandamideShakyananandamideShakyan
committed
ui changes
1 parent 3db14bb commit 72b0f23

File tree

5 files changed

+54
-22
lines changed

5 files changed

+54
-22
lines changed

‎presto-native-execution/presto_cpp/main/PrestoTask.cpp

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -791,16 +791,6 @@ void PrestoTask::updateExecutionInfoLocked(
791791
prestoTaskStats.outputPositions = 0;
792792
prestoTaskStats.outputDataSizeInBytes = 0;
793793

794-
// Presto Java reports number of drivers to number of splits in Presto UI
795-
// because split and driver are 1 to 1 mapping relationship. This is not true
796-
// in Prestissimo where 1 driver handles many splits. In order to quickly
797-
// unblock developers from viewing the correct progress of splits in
798-
// Prestissimo's coordinator UI, we put number of splits in total, queued, and
799-
// finished to indicate the progress of the query. Number of running drivers
800-
// are passed as it is to have a proper running drivers count in UI.
801-
//
802-
// TODO: We should really extend the API (protocol::TaskStats and Presto
803-
// coordinator UI) to have splits information as a proper fix.
804794
prestoTaskStats.totalDrivers = veloxTaskStats.numTotalDrivers;
805795
prestoTaskStats.queuedDrivers = veloxTaskStats.numQueuedDrivers;
806796
prestoTaskStats.runningDrivers = veloxTaskStats.numRunningDrivers;

‎presto-router/src/main/resources/router_ui/src/components/QueryList.jsx

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,19 +69,35 @@ export class QueryListItem extends React.Component {
6969
const query = this.props.query;
7070
const progressBarStyle = {width: getProgressBarPercentage(query) + "%", backgroundColor: getQueryStateColor(query)};
7171

72+
const driverDetails = (
73+
<div className="col-xs-12 tinystat-row">
74+
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Completed drivers">
75+
<span className="glyphicon glyphicon-ok" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
76+
{query.queryStats.completedDrivers}
77+
</span>
78+
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Running drivers">
79+
<span className="glyphicon glyphicon-play" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
80+
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.runningDrivers}
81+
</span>
82+
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Queued drivers">
83+
<span className="glyphicon glyphicon-pause" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
84+
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.queuedDrivers}
85+
</span>
86+
</div>);
87+
7288
const splitDetails = (
7389
<div className="col-xs-12 tinystat-row">
7490
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Completed splits">
7591
<span className="glyphicon glyphicon-ok" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
76-
{query.queryStats.completedDrivers}
92+
{query.queryStats.completedSplits}
7793
</span>
7894
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Running splits">
7995
<span className="glyphicon glyphicon-play" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
80-
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.runningDrivers}
96+
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.runningSplits}
8197
</span>
8298
<span className="tinystat" data-toggle="tooltip" data-placement="top" title="Queued splits">
8399
<span className="glyphicon glyphicon-pause" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
84-
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.queuedDrivers}
100+
{(query.state === "FINISHED" || query.state === "FAILED") ? 0 : query.queryStats.queuedSplits}
85101
</span>
86102
</div>);
87103

@@ -152,6 +168,9 @@ export class QueryListItem extends React.Component {
152168
</span>
153169
</div>
154170
</div>
171+
<div className="row stat-row">
172+
{driverDetails}
173+
</div>
155174
<div className="row stat-row">
156175
{splitDetails}
157176
</div>

‎presto-ui/src/components/QueryDetail.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,7 @@ function TaskList({tasks}) {
159159
name: (<span className="bi bi-pause-circle-fill" style={GLYPHICON_HIGHLIGHT}
160160
data-bs-toggle="tooltip" data-bs-placement="top"
161161
title="Pending splits"/>),
162-
selector: row => row.stats.queuedDrivers,
162+
selector: row => row.stats.queuedSplits,
163163
sortable: true,
164164
maxWidth: '50px',
165165
minWidth: '40px',
@@ -168,7 +168,7 @@ function TaskList({tasks}) {
168168
name: (<span className="bi bi-play-circle-fill" style={GLYPHICON_HIGHLIGHT}
169169
data-bs-toggle="tooltip" data-bs-placement="top"
170170
title="Running splits"/>),
171-
selector: row => row.stats.runningDrivers,
171+
selector: row => row.stats.runningSplits,
172172
sortable: true,
173173
maxWidth: '50px',
174174
minWidth: '40px',
@@ -187,7 +187,7 @@ function TaskList({tasks}) {
187187
name: (<span className="bi bi-check-lg" style={GLYPHICON_HIGHLIGHT}
188188
data-bs-toggle="tooltip" data-bs-placement="top"
189189
title="Completed splits"/>),
190-
selector: row => row.stats.completedDrivers,
190+
selector: row => row.stats.completedSplits,
191191
sortable: true,
192192
maxWidth: '50px',
193193
minWidth: '40px',

‎presto-ui/src/components/QueryList.jsx

Lines changed: 22 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -142,19 +142,35 @@ export class QueryListItem extends React.Component {
142142
const humanReadableState = getHumanReadableStateFromInfo(query);
143143
const progressBarTitle = getProgressBarTitle(query.progress.progressPercentage, query.queryState, humanReadableState);
144144

145+
const driverDetails = (
146+
<div className="col-12 tinystat-row">
147+
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Completed drivers">
148+
<span className="bi bi-check-lg" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
149+
{formatCount(query.progress.completedDrivers)}
150+
</span>
151+
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Running drivers">
152+
<span className="bi bi-play-circle-fill" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
153+
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.runningDrivers}
154+
</span>
155+
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Queued drivers">
156+
<span className="bi bi-pause-btn-fill" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
157+
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.queuedDrivers}
158+
</span>
159+
</div>);
160+
145161
const splitDetails = (
146162
<div className="col-12 tinystat-row">
147163
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Completed splits">
148164
<span className="bi bi-check-lg" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
149-
{formatCount(query.progress.completedDrivers)}
165+
{formatCount(query.progress.completedSplits)}
150166
</span>
151167
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Running splits">
152168
<span className="bi bi-play-circle-fill" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
153-
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.runningDrivers}
169+
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.runningSplits}
154170
</span>
155171
<span className="tinystat" data-bs-toggle="tooltip" data-bs-placement="top" title="Queued splits">
156172
<span className="bi bi-pause-btn-fill" style={GLYPHICON_HIGHLIGHT}/>&nbsp;&nbsp;
157-
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.queuedDrivers}
173+
{(query.queryState === "FINISHED" || query.queryState === "FAILED") ? 0 : query.progress.queuedSplits}
158174
</span>
159175
</div>);
160176

@@ -236,6 +252,9 @@ export class QueryListItem extends React.Component {
236252
</span>
237253
</div>
238254
</div>
255+
<div className="row stat-row">
256+
{driverDetails}
257+
</div>
239258
<div className="row stat-row">
240259
{splitDetails}
241260
</div>

‎presto-ui/src/components/QueryOverview.jsx

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,10 @@ type TaskStats = {
5858
blockedDrivers: number;
5959
totalDrivers: number;
6060
completedDrivers: number;
61+
queuedSplits: number;
62+
runningSplits: number;
63+
totalSplits: number;
64+
completedSplits: number;
6165
rawInputPositions: number;
6266
rawInputDataSizeInBytes: number;
6367
totalScheduledTimeInNanos: number;
@@ -327,7 +331,7 @@ function TaskList({ tasks }: { tasks: Task[] }) : React.Node {
327331
name: (<span className="bi bi-pause-circle-fill" style={GLYPHICON_HIGHLIGHT}
328332
data-bs-toggle="tooltip" data-placement="top"
329333
title="Pending splits" />),
330-
selector: (row: Task) => row.stats.queuedDrivers,
334+
selector: (row: Task) => row.stats.queuedSplits,
331335
sortable: true,
332336
maxWidth: '50px',
333337
minWidth: '40px',
@@ -336,7 +340,7 @@ function TaskList({ tasks }: { tasks: Task[] }) : React.Node {
336340
name: (<span className="bi bi-play-circle-fill" style={GLYPHICON_HIGHLIGHT}
337341
data-bs-toggle="tooltip" data-placement="top"
338342
title="Running splits" />),
339-
selector: (row: Task) => row.stats.runningDrivers,
343+
selector: (row: Task) => row.stats.runningSplits,
340344
sortable: true,
341345
maxWidth: '50px',
342346
minWidth: '40px',
@@ -355,7 +359,7 @@ function TaskList({ tasks }: { tasks: Task[] }) : React.Node {
355359
name: (<span className="bi bi-check-lg" style={GLYPHICON_HIGHLIGHT}
356360
data-bs-toggle="tooltip" data-placement="top"
357361
title="Completed splits" />),
358-
selector: (row: Task) => row.stats.completedDrivers,
362+
selector: (row: Task) => row.stats.completedSplits,
359363
sortable: true,
360364
maxWidth: '50px',
361365
minWidth: '40px',

0 commit comments

Comments
 (0)