Skip to content

Commit 84f5fd9

Browse files
committed
[SPARK-51467][UI] Make tables of the environment page filterable
### What changes were proposed in this pull request? This PR adds multi-column filtering ability to the tables of the environment page. ### Why are the changes needed? improve the debugability of the Spark UI ### Does this PR introduce _any_ user-facing change? yes, but only UI changes ### How was this patch tested? ![image](https://github.com/user-attachments/assets/7bac4a4e-13c8-4b75-9b87-693bea4846b8) ### Was this patch authored or co-authored using generative AI tooling? no Closes #50233 from yaooqinn/SPARK-51467. Authored-by: Kent Yao <yao@apache.org> Signed-off-by: Kent Yao <yao@apache.org>
1 parent 9fc84c7 commit 84f5fd9

File tree

2 files changed

+63
-0
lines changed

2 files changed

+63
-0
lines changed
Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
/*
2+
* Licensed to the Apache Software Foundation (ASF) under one or more
3+
* contributor license agreements. See the NOTICE file distributed with
4+
* this work for additional information regarding copyright ownership.
5+
* The ASF licenses this file to You under the Apache License, Version 2.0
6+
* (the "License"); you may not use this file except in compliance with
7+
* the License. You may obtain a copy of the License at
8+
*
9+
* http://www.apache.org/licenses/LICENSE-2.0
10+
*
11+
* Unless required by applicable law or agreed to in writing, software
12+
* distributed under the License is distributed on an "AS IS" BASIS,
13+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
14+
* See the License for the specific language governing permissions and
15+
* limitations under the License.
16+
*/
17+
18+
/* global $ */
19+
20+
$(document).ready(function(){
21+
$('th').on('click', function(e) {
22+
let inputBox = $(this).find('.env-table-filter-input');
23+
if (inputBox.length === 0) {
24+
$('<input class="env-table-filter-input form-control" type="text">')
25+
.appendTo(this)
26+
.focus();
27+
} else {
28+
inputBox.toggleClass('d-none');
29+
inputBox.focus();
30+
}
31+
e.stopPropagation();
32+
});
33+
34+
$(document).on('click', function() {
35+
$('.env-table-filter-input').toggleClass('d-none', true);
36+
});
37+
38+
$(document).on('input', '.env-table-filter-input', function() {
39+
const table = $(this).closest('table');
40+
const filters = table.find('.env-table-filter-input').map(function() {
41+
const columnIdx = $(this).closest('th').index();
42+
const searchString = $(this).val().toLowerCase();
43+
return { columnIdx, searchString };
44+
}).get();
45+
46+
table.find('tbody tr').each(function() {
47+
let showRow = true;
48+
for (const filter of filters) {
49+
const cellText = $(this).find('td').eq(filter.columnIdx).text().toLowerCase();
50+
if (filter.searchString && cellText.indexOf(filter.searchString) === -1) {
51+
showRow = false;
52+
break;
53+
}
54+
}
55+
if (showRow) {
56+
$(this).show();
57+
} else {
58+
$(this).hide();
59+
}
60+
});
61+
});
62+
});

core/src/main/scala/org/apache/spark/ui/env/EnvironmentPage.scala

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -169,6 +169,7 @@ private[ui] class EnvironmentPage(
169169
<div class="aggregated-classpathEntries collapsible-table collapsed">
170170
{classpathEntriesTable}
171171
</div>
172+
<script src={UIUtils.prependBaseUri(request, "/static/environmentpage.js")}></script>
172173
</span>
173174

174175
UIUtils.headerSparkPage(request, "Environment", content, parent)

0 commit comments

Comments
 (0)