Skip to content

Commit 744ce13

Browse files
PDavidPDavid
authored
HBASE-28832 Upgrade from bootstrap 3.4.1 to non vulnerable version 5.3.3 (#6490)
### Details First we upgraded to Bootstrap v4 - this was the majority of the changes - and then I upgraded to Bootstrap 5.3.3 - which is the latest non-vulnerable version according to https://security.snyk.io/package/npm/bootstrap/3.4.1 Changes were based on the migration documentation: - https://getbootstrap.com/docs/4.6/migration/ - https://getbootstrap.com/docs/5.3/migration/ Most of the changes are related to navbar-s, tabs and forms. The new Bootstrap look has a bit bigger font sizes but it is still OK in my opinion. Bootstrap v5 is not requiring JQuery anymore but we have some JQuery plugins (jquery.tablesorter.min.js, tab.js) which still need it so I left JQuery in. ### Changes - Removed bootstrap-theme.min.css and Glyphicons icon font because these are not present anymore in newer Bootstrap versions. - Upgraded checked in Bootstrap CSS and JS files to v4. - Moved some inline CSS styles to hbase.css file (DRY). - The page-header class was dropped in Bootstrap v4 so added page-header small grey color to hbase.css. - Removed some unused imports in JSP files. - Improved the styling of the Log Level form - Replaced hbase_logo_small.png under thrift module with the hbase-server one. Reason: to make sure that they are the same size (this under thrift was smaller). - Upgraded checked in Bootstrap CSS and JS files to v5. - Migrated navbars for v5: - Navbars now require a container within (to drastically simplify spacing requirements and CSS required). - The .active class can no longer be applied to .nav-items, it must be applied directly on .nav-links. - Migrated data attributes. Data attributes for all Bootstrap JavaScript plugins are now namespaced to help distinguish Bootstrap functionality from third parties and your own code. For example, we use data-bs-toggle instead of data-toggle. - form-inline was dropped in v5, so inline forms had to be styled with grid and utilities instead. - Added the favicon of the HBase website to the web UI pages. Signed-off-by: Nick Dimiduk <[email protected]> Signed-off-by: Nihal Jain <[email protected]>
1 parent 6ebd48e commit 744ce13

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+1212
-1670
lines changed

‎NOTICE.txt

+3-11
Original file line numberDiff line numberDiff line change
@@ -23,19 +23,11 @@ relicensed so we could use it as Creative Commons Attribution 3.0.
2323
The license is bundled with the download available here:
2424
http://www.vectorportal.com/subcategory/205/KILLER-WHALE-FREE-VECTOR.eps/ifile/9136/detailtest.asp
2525
--
26-
This product includes portions of the Bootstrap project v3.0.0
26+
This product includes portions of the Bootstrap project v5.3.3
2727

28-
Copyright 2013 Twitter, Inc.
28+
Copyright 2011-2024 The Bootstrap Authors
2929

30-
Licensed under the Apache License v2.0
31-
32-
This product uses the Glyphicons Halflings icon set.
33-
34-
http://glyphicons.com/
35-
36-
Copyright Jan Kovařík
37-
38-
Licensed under the Apache License v2.0 as a part of the Bootstrap project.
30+
Licensed under the MIT license
3931

4032
--
4133
This product includes portions of the Guava project v14 and v21, specifically

‎hbase-http/src/main/java/org/apache/hadoop/hbase/http/log/LogLevel.java

+23-18
Original file line numberDiff line numberDiff line change
@@ -326,7 +326,7 @@ public void doGet(HttpServletRequest request, HttpServletResponse response)
326326
String[] readOnlyLogLevels = conf.getStrings(READONLY_LOGGERS_CONF_KEY);
327327

328328
if (logName != null) {
329-
out.println("<p>Results:</p>");
329+
out.println("<h2>Results</h2>");
330330
out.println(MARKER + "Submitted Log Name: <b>" + logName + "</b><br />");
331331

332332
Logger log = LoggerFactory.getLogger(logName);
@@ -373,23 +373,28 @@ private void sendError(HttpServletResponse response, int code, String message)
373373

374374
static final String FORMS = "<div class='container-fluid content'>\n"
375375
+ "<div class='row inner_header top_header'>\n" + "<div class='page-header'>\n"
376-
+ "<h1>Get/Set Log Level</h1>\n" + "</div>\n" + "</div>\n" + "Actions:" + "<p>" + "<center>\n"
377-
+ "<table class='table' style='border: 0;' width='95%' >\n" + "<tr>\n" + "<form>\n"
378-
+ "<td class='centered'>\n"
379-
+ "<input style='font-size: 12pt; width: 10em' type='submit' value='Get Log Level'"
380-
+ " class='btn' />\n" + "</td>\n" + "<td style='text-align: center;'>\n"
381-
+ "<input type='text' name='log' size='50' required='required'"
382-
+ " placeholder='Log Name (required)' />\n" + "</td>\n" + "<td width=\"40%\">"
383-
+ "Get the current log level for the specified log name." + "</td>\n" + "</form>\n"
384-
+ "</tr>\n" + "<tr>\n" + "<form>\n" + "<td class='centered'>\n"
385-
+ "<input style='font-size: 12pt; width: 10em' type='submit'"
386-
+ " value='Set Log Level' class='btn' />\n" + "</td>\n" + "<td style='text-align: center;'>\n"
387-
+ "<input type='text' name='log' size='50' required='required'"
388-
+ " placeholder='Log Name (required)' />\n"
389-
+ "<input type='text' name='level' size='50' required='required'"
390-
+ " placeholder='Log Level (required)' />\n" + "</td>\n" + "<td width=\"40%\" style=\"\">"
391-
+ "Set the specified log level for the specified log name." + "</td>\n" + "</form>\n"
392-
+ "</tr>\n" + "</table>\n" + "</center>\n" + "</p>\n" + "<hr/>\n";
376+
+ "<h1>Get/Set Log Level</h1>\n" + "</div>\n" + "</div>\n" + "\n" + "<h2>Actions</h2>\n"
377+
+ "\n" + "<div class='row mb-4'>\n" + "<div class='col'>\n"
378+
+ "<form class='row g-3 align-items-center justify-content-center'>\n"
379+
+ "<div class='col-sm-auto'>\n"
380+
+ "<button type='submit' class='btn btn-primary'>Get Log Level</button>\n" + "</div>\n"
381+
+ " <div class='col-sm-auto'>\n"
382+
+ "<input type='text' name='log' class='form-control' size='50'"
383+
+ " required='required' placeholder='Log Name (required)'>\n" + "</div>\n"
384+
+ " <div class='col-sm-auto'>\n"
385+
+ "<span>Gets the current log level for the specified log name.</span>\n" + "</div>\n"
386+
+ "</form>\n" + "</div>\n" + "</div>\n" + "\n" + "<div class='row'>\n" + "<div class='col'>\n"
387+
+ "\n" + "<form class='row g-3 align-items-center justify-content-center'>\n"
388+
+ "<div class='col-sm-auto'>\n"
389+
+ "<button type='submit' class='btn btn-primary'>Set Log Level</button>\n" + "</div>\n"
390+
+ "<div class='col-sm-auto'>\n"
391+
+ "<input type='text' name='log' class='form-control mb-2' size='50'"
392+
+ " required='required' placeholder='Log Name (required)'>\n"
393+
+ "<input type='text' name='level' class='form-control' size='50'"
394+
+ " required='required' placeholder='Log Level (required)'>\n" + "</div>\n"
395+
+ "<div class='col-sm-auto'>\n"
396+
+ "<span>Sets the specified log level for the specified log name.</span>\n" + "</div>\n"
397+
+ "</form>\n" + "\n" + "</div>\n" + "</div>" + "<hr>\n";
393398

394399
private static void process(Logger logger, String levelName, PrintWriter out) {
395400
if (levelName != null) {

‎hbase-resource-bundle/src/main/resources/META-INF/NOTICE.vm

+3-11
Original file line numberDiff line numberDiff line change
@@ -54,19 +54,11 @@ http://www.vectorportal.com/subcategory/205/KILLER-WHALE-FREE-VECTOR.eps/ifile/9
5454
## For modules that have bootstrap in their source tree
5555
#macro(bootstrap_notice)
5656
--
57-
This product includes portions of the Bootstrap project v3.0.0
57+
This product includes portions of the Bootstrap project v5.3.3
5858

59-
Copyright 2013 Twitter, Inc.
59+
Copyright 2011-2024 The Bootstrap Authors
6060

61-
Licensed under the Apache License v2.0
62-
63-
This product uses the Glyphicons Halflings icon set.
64-
65-
http://glyphicons.com/
66-
67-
Copyright Jan Kovařík
68-
69-
Licensed under the Apache License v2.0 as a part of the Bootstrap project.
61+
Licensed under the MIT license
7062
#end
7163
## no NOTICE file.
7264
#macro(findbugs_cleanroom_notice)

‎hbase-rest/src/main/resources/hbase-webapps/rest/footer.jsp

+2-2
Original file line numberDiff line numberDiff line change
@@ -23,8 +23,8 @@
2323
<script src="/static/js/tab.js" type="text/javascript"></script>
2424
<script type="text/javascript">
2525
$(document).ready(function() {
26-
$('div.navbar li.active').removeClass('active');
27-
$('a[href="' + location.pathname + '"]').closest('li').addClass('active');
26+
$('nav.navbar li.active').removeClass('active');
27+
$('a[href="' + location.pathname + '"]').addClass('active');
2828
});
2929
</script>
3030
</body>

‎hbase-rest/src/main/resources/hbase-webapps/rest/header.jsp

+24-28
Original file line numberDiff line numberDiff line change
@@ -30,45 +30,41 @@
3030
<meta name="description" content="">
3131

3232
<link href="/static/css/bootstrap.min.css" rel="stylesheet">
33-
<link href="/static/css/bootstrap-theme.min.css" rel="stylesheet">
3433
<link href="/static/css/hbase.css" rel="stylesheet">
34+
<link rel="shortcut icon" href="/static/favicon.ico">
3535
</head>
3636

3737
<body>
38-
<div class="navbar navbar-fixed-top navbar-default">
38+
<nav class="navbar navbar-expand-md navbar-light fixed-top bg-light">
3939
<div class="container-fluid">
40-
<div class="navbar-header">
41-
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
42-
<span class="icon-bar"></span>
43-
<span class="icon-bar"></span>
44-
<span class="icon-bar"></span>
45-
</button>
46-
<a class="navbar-brand" href="/rest.jsp"><img src="/static/hbase_logo_small.png" alt="HBase Logo"/></a>
47-
</div>
40+
<a class="navbar-brand" href="/rest.jsp"><img src="/static/hbase_logo_small.png" alt="HBase Logo"/></a>
41+
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse">
42+
<span class="navbar-toggler-icon"></span>
43+
</button>
4844
<div class="collapse navbar-collapse">
49-
<ul class="nav navbar-nav">
50-
<li class="active"><a href="/rest.jsp">Home</a></li>
51-
<li><a href="/logs/">Local logs</a></li>
52-
<li><a href="/processRest.jsp">Process Metrics</a></li>
53-
<li><a href="/logLevel">Log Level</a></li>
54-
<li><a href="/dump">Debug Dump</a></li>
45+
<ul class="navbar-nav">
46+
<li class="nav-item"><a class="nav-link" href="/rest.jsp">Home</a></li>
47+
<li class="nav-item"><a class="nav-link" href="/logs/">Local logs</a></li>
48+
<li class="nav-item"><a class="nav-link" href="/processRest.jsp">Process Metrics</a></li>
49+
<li class="nav-item"><a class="nav-link" href="/logLevel">Log Level</a></li>
50+
<li class="nav-item"><a class="nav-link" href="/dump">Debug Dump</a></li>
5551
<li class="nav-item dropdown">
56-
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
52+
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
5753
Metrics <span class="caret"></span>
5854
</a>
59-
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
60-
<li><a target="_blank" href="/jmx">JMX</a></li>
61-
<li><a target="_blank" href="/jmx?description=true">JMX with description</a></li>
62-
<li><a target="_blank" href="/prometheus">Prometheus</a></li>
63-
<li><a target="_blank" href="/prometheus?description=true">Prometheus with description</a></li>
64-
</ul>
55+
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
56+
<a class="dropdown-item" target="_blank" href="/jmx">JMX</a>
57+
<a class="dropdown-item" target="_blank" href="/jmx?description=true">JMX with description</a>
58+
<a class="dropdown-item" target="_blank" href="/prometheus">Prometheus</a>
59+
<a class="dropdown-item" target="_blank" href="/prometheus?description=true">Prometheus with description</a>
60+
</div>
6561
</li>
66-
<li><a href="/prof">Profiler</a></li>
62+
<li class="nav-item"><a class="nav-link" href="/prof">Profiler</a></li>
6763
<% if (HBaseConfiguration.isShowConfInServlet()) { %>
68-
<li><a href="/conf">HBase Configuration</a></li>
64+
<li class="nav-item"><a class="nav-link" href="/conf">HBase Configuration</a></li>
6965
<% } %>
7066
</ul>
71-
</div><!--/.nav-collapse -->
72-
</div>
73-
</div>
67+
</div><!--/.navbar-collapse -->
68+
</div><!--/.container-fluid -->
69+
</nav>
7470

‎hbase-rest/src/main/resources/hbase-webapps/rest/processRest.jsp

+9-9
Original file line numberDiff line numberDiff line change
@@ -105,16 +105,16 @@ pageContext.setAttribute("pageTitle", "Process info for PID: " + JSONMetricUtil.
105105
</div>
106106
<% if (gcBeans.size() == 2) { %>
107107
<div class="tabbable">
108-
<ul class="nav nav-pills">
109-
<li class="active">
110-
<a href="#tab_gc1" data-toggle="tab"><%=collector1.getName() %></a>
108+
<ul class="nav nav-pills" role="tablist">
109+
<li class="nav-item">
110+
<a class="nav-link active" href="#tab_gc1" data-bs-toggle="tab" role="tab"><%=collector1.getName() %></a>
111+
</li>
112+
<li class="nav-item">
113+
<a class="nav-link" href="#tab_gc2" data-bs-toggle="tab" role="tab"><%=collector2.getName() %></a>
111114
</li>
112-
<li class="">
113-
<a href="#tab_gc2" data-toggle="tab"><%=collector2.getName() %></a>
114-
</li>
115115
</ul>
116-
<div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
117-
<div class="tab-pane active" id="tab_gc1">
116+
<div class="tab-content">
117+
<div class="tab-pane active" id="tab_gc1" role="tabpanel">
118118
<table class="table table-striped">
119119
<tr>
120120
<th>Collection Count</th>
@@ -129,7 +129,7 @@ pageContext.setAttribute("pageTitle", "Process info for PID: " + JSONMetricUtil.
129129
</tr>
130130
</table>
131131
</div>
132-
<div class="tab-pane" id="tab_gc2">
132+
<div class="tab-pane" id="tab_gc2" role="tabpanel">
133133
<table class="table table-striped">
134134
<tr>
135135
<th>Collection Count</th>

‎hbase-rest/src/main/resources/hbase-webapps/rest/rest.jsp

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
3131
final RESTServer restServer = (RESTServer) getServletContext().getAttribute(RESTServer.REST_SERVER);
3232
final String hostName = restServer.getServerName().getHostname();
33-
pageContext.setAttribute("pageTitle", "HBase REST Server" + hostName);
33+
pageContext.setAttribute("pageTitle", "HBase REST Server: " + hostName);
3434
%>
3535

3636
<jsp:include page="header.jsp">

‎hbase-server/src/main/jamon/org/apache/hadoop/hbase/tmpl/common/TaskMonitorTmpl.jamon

+18-18
Original file line numberDiff line numberDiff line change
@@ -34,41 +34,41 @@ String parent = "";
3434
<h2><a name="tasks">Tasks</a></h2>
3535

3636
<div class="tabbable">
37-
<ul class="nav nav-pills">
38-
<li class="">
39-
<a href="#tab_alltasks" data-toggle="tab">Show All Monitored Tasks</a>
37+
<ul class="nav nav-pills" role="tablist">
38+
<li class="nav-item">
39+
<a class="nav-link" href="#tab_alltasks" data-bs-toggle="tab" role="tab">Show All Monitored Tasks</a>
4040
</li>
41-
<li class="active">
42-
<a href="#tab_generaltasks" data-toggle="tab">Show non-RPC Tasks</a>
41+
<li class="nav-item">
42+
<a class="nav-link active" href="#tab_generaltasks" data-bs-toggle="tab" role="tab">Show non-RPC Tasks</a>
4343
</li>
44-
<li class="">
45-
<a href="#tab_handlertasks" data-toggle="tab">Show All RPC Handler Tasks</a>
44+
<li class="nav-item">
45+
<a class="nav-link" href="#tab_handlertasks" data-bs-toggle="tab" role="tab">Show All RPC Handler Tasks</a>
4646
</li>
47-
<li class="">
48-
<a href="#tab_rpctasks" data-toggle="tab">Show Active RPC Calls</a>
47+
<li class="nav-item">
48+
<a class="nav-link" href="#tab_rpctasks" data-bs-toggle="tab" role="tab">Show Active RPC Calls</a>
4949
</li>
50-
<li>
51-
<a href="#tab_operationtasks" data-toggle="tab">Show Client Operations</a>
50+
<li class="nav-item">
51+
<a class="nav-link" href="#tab_operationtasks" data-bs-toggle="tab" role="tab">Show Client Operations</a>
5252
</li>
5353
</ul>
54-
<div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
55-
<div class="tab-pane" id="tab_alltasks">
54+
<div class="tab-content">
55+
<div class="tab-pane" id="tab_alltasks" role="tabpanel">
5656
<& jsonView; filter="all" &>
5757
<& renderTasks; filter="all" &>
5858
</div>
59-
<div class="tab-pane active" id="tab_generaltasks">
59+
<div class="tab-pane active" id="tab_generaltasks" role="tabpanel">
6060
<& jsonView; filter="general" &>
6161
<& renderTasks; filter="general" &>
6262
</div>
63-
<div class="tab-pane" id="tab_handlertasks">
63+
<div class="tab-pane" id="tab_handlertasks" role="tabpanel">
6464
<& jsonView; filter="handler" &>
6565
<& renderTasks; filter="handler" &>
6666
</div>
67-
<div class="tab-pane" id="tab_rpctasks">
67+
<div class="tab-pane" id="tab_rpctasks" role="tabpanel">
6868
<& jsonView; filter="rpc" &>
6969
<& renderTasks; filter="rpc" &>
7070
</div>
71-
<div class="tab-pane" id="tab_operationtasks">
71+
<div class="tab-pane" id="tab_operationtasks" role="tabpanel">
7272
<& jsonView; filter="operation" &>
7373
<& renderTasks; filter="operation" &>
7474
</div>
@@ -136,5 +136,5 @@ String parent = "";
136136
MonitoredTask.State state;
137137
</%args>
138138
<%java> if (state == MonitoredTask.State.COMPLETE) { </%java>alert alert-success<%java> } </%java>
139-
<%java> else if (state == MonitoredTask.State.ABORTED) { </%java>alert alert-error<%java> } </%java>
139+
<%java> else if (state == MonitoredTask.State.ABORTED) { </%java>alert alert-danger<%java> } </%java>
140140
</%def>

0 commit comments

Comments
 (0)