YARN-11757. [UI2] Add partition usage overview to the Queues page

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/helpers/get-from-map.js

@@ -0,0 +1,72 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import Ember from 'ember';
+
+
+function getNestedValue(obj, path) {
+  return path.split('.').reduce((acc, key) => {
+    if (acc === null || acc === undefined) {
+      return undefined;
+    }
+
+   /* Handle array indexing.
+   Sample input data:
+    {
+      "partitionKey": {
+        "configuredMinResource": {
+          "resourceInformations": {
+            "resourceInformation": [
+              {
+                "maximumAllocation": 1024
+              },
+              {
+                "maximumAllocation": 88
+              }
+            ]
+          }
+        }
+      }
+    }
+  */
+    const arrayMatch = key.match(/(\w+)\[(\d+)\]/);
+    if (arrayMatch) {
+      const arrayKey = arrayMatch[1];
+      const arrayIndex = parseInt(arrayMatch[2], 10);
+      return acc[arrayKey] && acc[arrayKey][arrayIndex];
+    }
+
+    return acc[key];
+  }, obj);
+}
+
+export function getFromMap(params, hash) {
+  /*
+  Extract map values based on the key provided and the path to the nested value
+  Example:
+  XPATH from the metrics: /scheduler/schedulerInfo/capacities/queueCapacitiesByPartition[3]/configuredMinResource/resourceInformations/resourceInformation[2]/maximumAllocation
+  The partition map is: queueCapacitiesByPartition and accessed as "partitionMap" from the code defined in the models/yarn-queue/capacity-queue.js
+  The supplied hash.map is partitionMap
+  The supplied key is the partition name (nodelabel), e.g. "customPartition"
+  The parameter is "configuredMinResource/resourceInformations/resourceInformation[2]/maximumAllocation"
+  The returned value is the value of the maximumAllocation, which in this case will be the number of vCores present.
+  */
+  return getNestedValue(hash.map[hash.key], hash.parameter);
+}
+
+export default Ember.Helper.helper(getFromMap);

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/partition-usage.hbs

@@ -0,0 +1,66 @@
+{!
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+}}
+<div class="row">
+  <div class="col-md-12 container-fluid">
+    <div class="panel panel-default queue-page-breadcrumb" id="partition-usage-container">
+      <div class="panel-heading">
+        {{model.firstObject.type}} scheduler - Partition usage overview
+     </div>
+     <div class="flex">
+        {{log module.exports}}
+        {{#if (eq model.firstObject.type "capacity")}}
+
+        <table class="table table-striped table-bordered active-user-table">
+          <thead>
+            <tr>
+              <th>Partition Name</th>
+              <th>Resource Used from the Partition</th>
+              <th>Total Resource in the Partition</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr style="display: none;">
+            </tr>
+            {{#each model.firstObject.partitions as |part|}}
+            <tr>
+              <td>{{part}}</td>
+              <td>{{getFromMap map=model.firstObject.partitionMap key=part parameter="usedCapacity" }}%</td>
+              <!--
+              /scheduler/schedulerInfo/queues/queue[1]/capacities/queueCapacitiesByPartition[1]/effectiveMaxResource/resourceInformations/resourceInformation[1]/name[text()='memory-mb']
+              /scheduler/schedulerInfo/queues/queue[1]/capacities/queueCapacitiesByPartition[1]/effectiveMaxResource/resourceInformations/resourceInformation[1]/value[text()='2703']
+              -->
+              <td>
+                {{#each (getFromMap map=model.firstObject.partitionMap key=part parameter="effectiveMaxResource.resourceInformations.resourceInformation") as |resource|}}
+                  <span class="yarn-label secondary">
+                    <span class="label-key">{{resource.name}}</span>
+                    <span class="label-value">{{resource.value}}</span>
+                  </span>
+                {{/each}}
+              </td>
+            </tr>
+            {{/each}}
+          </tbody>
+        </table>
+
+        {{/if}}
+     </div>
+    </div>
+  </div>
+</div>
+
+{{yield}}

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/components/yarn-queue/capacity-queue.hbs

@@ -16,6 +16,8 @@
  * limitations under the License.
 }}
 
+{{partition-usage model=model.queues}}
+
 {{queue-navigator model=model.queues selected=model.selected
   used="usedCapacity" max="absMaxCapacity" setFilter=(action setFilter)}}
 
@@ -32,7 +34,7 @@
       </div>
     {{/if}}
 
-    {{yarn-queue-partition-capacity-labels partitionMap=model.selectedQueue.partitionMap queue=model.selectedQueue filteredPartition=filteredPartition}}
+    {{yarn-queue-partition-capacity-labels partitionMap=model.selectedQueue.partitionMap resourceUsagesByPartitionMap=model.selectedQueue.resourceUsagesByPartitionMap queue=model.selectedQueue filteredPartition=filteredPartition}}
   </div>
 
   <h5> Running Apps From All Users in Queue </h5>

hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/tests/unit/helpers/get-from-map-test.js

@@ -0,0 +1,28 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements.  See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership.  The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { getFromMap } from '../../../helpers/get-from-map';
+import { module, test } from 'qunit';
+
+module('Unit | Helper | get from map');
+
+// Replace this with your real tests.
+test('it works', function(assert) {
+  let result = getFromMap(42);
+  assert.ok(result);
+});