HDDS-7816. Add DataNode list to the SCM WebUI

[debiswal]

What changes were proposed in this pull request?
commit id : 74b7914
This Includes Sorting, Searching & Pagination on SCM UI where page deafult size is 10. we can also set this to 20 or 50 or 'All' records per page as well.
Page slicing & Record Slicing both have been implemented along wth sort & search.

Backend Changes ::
JMX API developed & the response from API is

"NodeStatusInfo" : [ {
"key" : "ozone_datanode_1.ozone_default",
"value" : [ "HEALTHY", "IN_SERVICE" ]
}, {
"key" : "ozone_datanode_3.ozone_default",
"value" : [ "HEALTHY", "IN_SERVICE" ]
}, {
"key" : "ozone_datanode_2.ozone_default",
"value" : [ "HEALTHY", "IN_SERVICE" ]
} ]

Note: HDDS 7816 JIRA includes both UI & Backend changes .

What is the link to the Apache JIRA
https://issues.apache.org/jira/browse/HDDS-7816

How was this patch tested?

Manually
Attached screenshot for reference

Search:

Sort:

[fapifta]

Hi @debiswal,
thank you for working on this piece, I have gone through the changes proposed, and it looks ok, though I have some inline comments around indentation, and code formatting which I would like to see addressed before we can commit this one.

I also found an unexpected behaviour in the code with sorting.
Due to the fact that there is only one reverse boolean in the $scope, and all columns are depending on that, if you change the sort order by clicking in any column, the arrow will change in all the columns.
Also as the arrow present in all the column headers, not just the one that is used for sorting, there is no way to tell from the UI state which column is used for sorting actually.

I would suggest to have one more arrow style besides the up and down arrows, the one that combines both. So that we can show the combined up and down arrow for the columns that are not the one we sort on, and the single up or down arrow can be used in the column based on which we sort.
Also please take care of resetting the reverse flag when the base column of the sort changes, so if we click on a column the sort order is always ascending first.

[debiswal]

commit id : 8111630

1. Sorting enabled wrt each column name.
2. When page loads it loads with Hostname sorting ascending order enabled with default.
3. sorting symbol from user point of View .

screenshot attached for below change

[fapifta]

Hi @debiswal thank you for addressing my concerns, I will commit these changes shortly.