This is an automated email from the ASF dual-hosted git repository.
zaynt4606 pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/celeborn.git
The following commit(s) were added to refs/heads/main by this push:
new 8fe1745f83 [CELEBORN-2505][UI] Reorder and collapse sections in the
Spark UI Celeborn tab
8fe1745f83 is described below
commit 8fe1745f8350f4d435746106d6343a0b2489b25c
Author: yew1eb <[email protected]>
AuthorDate: Tue Oct 27 10:51:53 2026 +0800
[CELEBORN-2505][UI] Reorder and collapse sections in the Spark UI Celeborn
tab
### What changes were proposed in this pull request?
- Move the "Celeborn Build Information" and "Celeborn Properties" sections
to the top of the Spark UI Celeborn tab, above "Shuffle Assignments" and
"Worker Slots".
- Collapse all collapsible sections by default (previously "Celeborn
Properties" was expanded).
- Unify section naming by dropping "Client" from the build info title:
"Celeborn Build Information".
### Why are the changes needed?
The build info and properties sections are the ones users check most often
(client version, commit, effective `spark.celeborn.*` configs), but they render
at the bottom of the page and "Celeborn Properties" is expanded by default,
pushing the summary and other sections away. Moving them to the top with all
sections collapsed by default makes the page scannable, and the naming becomes
consistent between the two sections.
### Does this PR resolve a correctness bug?
- [ ] Yes
### Does this PR introduce _any_ user-facing change?
- [x] Yes: Spark UI Celeborn tab section order and default collapse state
change; "Celeborn Client Build Information" is renamed to "Celeborn Build
Information". No config or API change.
### How was this patch tested?
Manually verified on a local docker-compose cluster (Celeborn master + 3
workers + Spark 3.5.9 standalone) with a `reduceByKey` shuffle job kept alive
via `spark-shell`. The rendered `/celeborn/` page shows the four sections in
the new order, all with `arrow-closed` and the `collapsed` class, and both the
build info table (version / commit / revision) and the properties table
populated.
<img width="761" height="439" alt="8839c71c9548b330a4af65e6a57d550e"
src="https://github.com/user-attachments/assets/7d506b7a-4962-425b-b60f-3be5d97832d3";
/>
<img width="1937" height="874" alt="84df82fab7d6d8fcb4e1fe7ffc887e14"
src="https://github.com/user-attachments/assets/5ef92db6-d876-4d69-ab5e-5a96c7d81973";
/>
Closes #3899 from yew1eb/CELEBORN-2505.
Authored-by: yew1eb <[email protected]>
Signed-off-by: zhengtao <[email protected]>
AI-Contributed/Feature: 0/44
AI-Contributed/UT: 0/0
---
.../shuffle/celeborn/ui/CelebornShufflePage.scala | 44 +++++++++++-----------
1 file changed, 22 insertions(+), 22 deletions(-)
diff --git
a/client-spark/spark-3-ui/src/main/scala/org/apache/spark/shuffle/celeborn/ui/CelebornShufflePage.scala
b/client-spark/spark-3-ui/src/main/scala/org/apache/spark/shuffle/celeborn/ui/CelebornShufflePage.scala
index 911a3831da..a8d4356e64 100644
---
a/client-spark/spark-3-ui/src/main/scala/org/apache/spark/shuffle/celeborn/ui/CelebornShufflePage.scala
+++
b/client-spark/spark-3-ui/src/main/scala/org/apache/spark/shuffle/celeborn/ui/CelebornShufflePage.scala
@@ -166,6 +166,28 @@ private[celeborn] class CelebornShufflePage(parent:
CelebornUITab)
val content =
<span>
{summary}
+ <span class="collapse-aggregated-celebornBuildInfo collapse-table"
+ onClick="collapseTable('collapse-aggregated-celebornBuildInfo',
+ 'aggregated-celebornBuildInfo')">
+ <h4>
+ <span class="collapse-table-arrow arrow-closed"></span>
+ <a>Celeborn Build Information</a>
+ </h4>
+ </span>
+ <div class="aggregated-celebornBuildInfo collapsible-table collapsed">
+ {buildInfoTable}
+ </div>
+ <span class="collapse-aggregated-celebornProperties collapse-table"
+ onClick="collapseTable('collapse-aggregated-celebornProperties',
+ 'aggregated-celebornProperties')">
+ <h4>
+ <span class="collapse-table-arrow arrow-closed"></span>
+ <a>Celeborn Properties</a>
+ </h4>
+ </span>
+ <div class="aggregated-celebornProperties collapsible-table collapsed">
+ {propertiesTable}
+ </div>
<span class="collapse-aggregated-celebornShuffleAssignments
collapse-table"
onClick="collapseTable('collapse-aggregated-celebornShuffleAssignments',
'aggregated-celebornShuffleAssignments')">
@@ -188,28 +210,6 @@ private[celeborn] class CelebornShufflePage(parent:
CelebornUITab)
<div class="aggregated-celebornWorkerSlots collapsible-table
collapsed">
{workerSlotsTable}
</div>
- <span class="collapse-aggregated-celebornBuildInfo collapse-table"
- onClick="collapseTable('collapse-aggregated-celebornBuildInfo',
- 'aggregated-celebornBuildInfo')">
- <h4>
- <span class="collapse-table-arrow arrow-closed"></span>
- <a>Celeborn Client Build Information</a>
- </h4>
- </span>
- <div class="aggregated-celebornBuildInfo collapsible-table collapsed">
- {buildInfoTable}
- </div>
- <span class="collapse-aggregated-celebornProperties collapse-table"
- onClick="collapseTable('collapse-aggregated-celebornProperties',
- 'aggregated-celebornProperties')">
- <h4>
- <span class="collapse-table-arrow arrow-open"></span>
- <a>Celeborn Properties</a>
- </h4>
- </span>
- <div class="aggregated-celebornProperties collapsible-table">
- {propertiesTable}
- </div>
</span>
UIUtils.headerSparkPage(request, "Celeborn Shuffle", content, parent)
