-
Notifications
You must be signed in to change notification settings - Fork 3.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add system.runtime.nodes information to web UI #11653
Conversation
@dedep PTAL |
@findepi Why hasn't anyone reviewed the code for so long? What happened to Trino community activity? If I can, I am willing to participate in the review process of assisting the community. LOL ^^ |
@whutpencil i am not a frontend dev person, so I wouldn't want to review myself, but let me try again find someone. |
return state; | ||
} | ||
} | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You have a checkstyle error here
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
@JsonProperty("coordinator") String coordinator, | ||
@JsonProperty("state") String state) | ||
{ | ||
this.nodeId = nodeId; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Use requireNonNull
.
this.nodeId = requireNonNull(nodeId, "nodeId is null");
this.nodeIp = requireNonNull(nodeIp, "nodeIp is null");
...
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
private final String nodeIp; | ||
private final String nodeVersion; | ||
private final String coordinator; | ||
private final String state; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If state
is either "active"
or "inactive"
then maybe it's better to have an enum for that?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
private final String nodeId; | ||
private final String nodeIp; | ||
private final String nodeVersion; | ||
private final String coordinator; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Imo, coordinator
should be boolean
. Why convert it to a String?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
|
||
refreshLoop() { | ||
clearTimeout(this.timeoutId); // to stop multiple series of refreshLoop from going on simultaneously | ||
// const nodeId = getFirstParameter(window.location.search); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you remove the commented code line?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
initialized: true, | ||
}); | ||
}); | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can you remove this empty line?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
} | ||
|
||
refreshLoop() { | ||
clearTimeout(this.timeoutId); // to stop multiple series of refreshLoop from going on simultaneously |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What's this.timeoutId
? I can't find where you set it.
I suppose you wanted to send a request in the loop, but you didn't add setTimeout
anywhere.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
<div id="worker-list"> | ||
<div class="loader">Loading...</div> | ||
</div> | ||
<!--<div id="worker-threads"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Please remove the commented code
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
}) | ||
for (var index in workerInfo) { | ||
this.setState({ | ||
workerId: addToHistory(workerInfo[index].nodeId, this.state.workerId), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
addToHistory
function signature is:
export function addToHistory (value: number, valuesArray: number[]): number[] {
You don't pass numbers, but strings.
I don't think you should use this function here.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
workerInfo: workerInfo | ||
}) | ||
for (var index in workerInfo) { | ||
this.setState({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think that you didn't design the state well. Instead of
{
workerId: string[],
workerIp: string[],
workerVersion: string[],
...
}
I would do (typescript notation):
{
workers: [
workerId: string,
workerIp: string,
workerVersion: string,
...
]
}
This way, the model is more concise and easier to work on
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
done.
@dedep Thank you very much for your detailed review. I'm not a full-time front-end staff, so I didn't use the corresponding data structure well in the implementation process. I learned a lot from your comments and have made changes according to your modification opinions. Please review again. |
this.nodeId = requireNonNull(nodeId, "nodeId is null"); | ||
this.nodeIp = requireNonNull(nodeIp, "nodeIp is null"); | ||
this.nodeVersion = requireNonNull(nodeVersion, "nodeVersion is null"); | ||
this.coordinator = requireNonNull(coordinator, "coordinator is null"); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There is no need to do the requireNonNull
check for a primitive (boolean
) type
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.
workerInfo: null, | ||
initialized: false, | ||
ended: false, | ||
workers: [{ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
workerId: String,
workerIp: String,
workerVersion: String,
coordinator: Boolean,
state: String
is not a correct JavaScript code. The code snippet I posted before was written in Typescript to show you the types.
So, I think it should be just: workers: []
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.
|
||
refreshLoop() { | ||
clearTimeout(this.timeoutId); | ||
$.get('/ui/api/worker', function (workerInfo) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would rename workerInfo
to workers
to signal that this is an array.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.
this.state = { | ||
workerInfo: null, | ||
initialized: false, | ||
ended: false, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think that ended
property is not used anywhere. IMO, you can remove this line
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done.
@dedep Excuse me, do you have any further amendments? Could this PR be merged into the master? |
Thanks for your contribution! |
Hey @whutpencil .. I would like to feature this PR in the Trino Community Broadcast next week. Would you be interested in joining me a guest in the episode? |
I am going ahead with demoing this in Trino Community Broadcast 35 on Thursday .. |
font{
line-height: 1.6;
}
ul,ol{
padding-left: 20px;
list-style-position: inside;
}
Hello, I'm very sorry that I'm busy recently due to my family. I didn't pay attention to the email and reply to your message in time. I am honored to contribute to Trino community. Thank you very much for your invitation. Do I need to prepare anything?
137497191
***@***.***
签名由
网易邮箱大师
定制
On 04/20/2022 14:43,Manfred ***@***.***> wrote:
I am going ahead with demoing this in Trino Community Broadcast 35 on Thursday ..
—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you were mentioned.Message ID: ***@***.***>
|
You can watch the demo and such now.. https://trino.io/episodes/35.html |
Description
The fact that you can't see a list of workers in the Web UI doesn't seem elegant. The goal of this PR is to improve it. The effect is shown in the figure below:
The value of active workers became a hyperlink.
When you click it, you will enter a new page with the contents as you run
select * from system.runtime.nodes;
the results obtained.At the same time, each node ID and node IP supports jumping to the corresponding machine to view information.
This is the effect of having multiple nodes in a formal cluster:
Related issues, pull requests, and links
Documentation
(x) No documentation is needed.
( ) Sufficient documentation is included in this PR.
( ) Documentation PR is available with #prnumber.
( ) Documentation issue #issuenumber is filed, and can be handled later.
Release notes
( ) No release notes entries required.
(x) Release notes entries required with the following suggested text: