Add label selector observability to placement group tables and actor and task detail pages#54292
Conversation
…and task detail pages Signed-off-by: Alan Guo <aguo@anyscale.com>
There was a problem hiding this comment.
Pull Request Overview
This PR adds observability for label selectors across several UI components and updates the placement group tables to use a unified code preview component.
- Extend the
Bundletype with an optionallabel_selectorfield. - Add “Label Selector” sections in Task and Actor detail pages using
CodeDialogButtonWithPreview. - Introduce a
LabelSelectorcolumn/component in the Placement Group table.
Reviewed Changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| python/ray/dashboard/client/src/type/placementGroup.ts | Add label_selector to Bundle type. |
| python/ray/dashboard/client/src/pages/task/TaskPage.tsx | Display label selector in task details. |
| python/ray/dashboard/client/src/pages/actor/ActorDetail.tsx | Display required resources and label selector. |
| python/ray/dashboard/client/src/components/PlacementGroupTable.tsx | Add LabelSelector component and table column. |
MengjinYan
left a comment
There was a problem hiding this comment.
Thank for the quick turn-around! I'm not familiar with the UI code to review the exact change, but the change of dashboard UI looks good!
|
@MengjinYan ready to merge! |
|
@edoakes Can you help to merge the PR? |
bartcheers
left a comment
There was a problem hiding this comment.
Looks great. Other than the waitFor vs setTimeout there's a small opportunity to DRY up undleResourceRequirements and LabelSelector since they share quite a bit of the logic, but they don't seem exactly the same so might be overdoing it.
| await user.type(input, "CREATED"); | ||
|
|
||
| // Wait for the filter to be applied | ||
| await new Promise((resolve) => setTimeout(resolve, 100)); |
There was a problem hiding this comment.
You can do something like this with testing-library instead of the timeouts, which should make the test less flaky:
await waitFor(() => {
expect(screen.queryByText("pg-987654321")).not.toBeInTheDocument();
expect(screen.queryByText("pg-555666777")).not.toBeInTheDocument();
});
There was a problem hiding this comment.
There 3 other places in this PR where you could replace setTimeout for waitFor
…and task detail pages (ray-project#54292) Follow-up to ray-project#53423 Missed a few places in the UI. Also updates placement group tables to use the same code preview component as the actor and tasks tables. Placement group table   Actor detail  Task detail  --------- Signed-off-by: Alan Guo <aguo@anyscale.com> Signed-off-by: ChanChan Mao <chanchanmao1130@gmail.com>
…and task detail pages (ray-project#54292) Follow-up to ray-project#53423 Missed a few places in the UI. Also updates placement group tables to use the same code preview component as the actor and tasks tables. Placement group table   Actor detail  Task detail  --------- Signed-off-by: Alan Guo <aguo@anyscale.com> Signed-off-by: jugalshah291 <shah.jugal291@gmail.com>
…and task detail pages (ray-project#54292) Follow-up to ray-project#53423 Missed a few places in the UI. Also updates placement group tables to use the same code preview component as the actor and tasks tables. Placement group table   Actor detail  Task detail  --------- Signed-off-by: Alan Guo <aguo@anyscale.com> Signed-off-by: Douglas Strodtman <douglas@anyscale.com>
Why are these changes needed?
Follow-up to #53423
Missed a few places in the UI.
Also updates placement group tables to use the same code preview component as the actor and tasks tables.
Placement group table


Actor detail

Task detail

Related issue number
Checks
git commit -s) in this PR.scripts/format.shto lint the changes in this PR.method in Tune, I've added it in
doc/source/tune/api/under thecorresponding
.rstfile.