add badge to each menu item

this is a possible way to address  #7628

IPython/html/static/tree/js/notebooklist.js

@@ -499,7 +499,11 define([
             if (selected_nums[i] === 0) {
                 $('#'+checkbox_ids[i])[0].indeterminate = false;
                 $('#'+checkbox_ids[i]).prop('checked', false);
-            } else if (selected_nums[i] === total_nums[i]) {
+                $('#badge-'+checkbox_ids[i]).text('');
+            } else {
+                // Update badge
+                $('#badge-'+checkbox_ids[i]).text(selected_nums[i]);
+                if (selected_nums[i] === total_nums[i]) {
                 $('#'+checkbox_ids[i])[0].indeterminate = false;
                 $('#'+checkbox_ids[i]).prop('checked', true);
             } else {
@@ -507,6 +511,7 define([
                 $('#'+checkbox_ids[i])[0].indeterminate = true;
             }
         }
+        }
     };
 
     NotebookList.prototype.add_link = function (model, item) {

IPython/html/templates/tree.html

@@ -88,6 +88,7 data-terminals-available="{{terminals_available}}"
                     <label for="select-folders">
                       <i class="item_icon folder_icon icon-fixed-width"></i>
                       Folders
+                      <span class="badge" id="badge-select-folders"></span>
                     </label>
                   </li>
                   <li role="presentation">
@@ -95,6 +96,7 data-terminals-available="{{terminals_available}}"
                     <label for="select-notebooks">
                       <i class="item_icon notebook_icon icon-fixed-width"></i>
                       All Notebooks
+                      <span class="badge" id="badge-select-notebooks"></span>
                     </label>
                   </li>
                   <li role="presentation">
@@ -102,6 +104,7 data-terminals-available="{{terminals_available}}"
                     <label for="select-running-notebooks">
                       <i class="item_icon running_notebook_icon icon-fixed-width"></i>
                       Running
+                      <span class="badge" id="badge-select-running-notebooks"></span>
                     </label>
                   </li>
                   <li role="presentation">
@@ -109,6 +112,7 data-terminals-available="{{terminals_available}}"
                     <label for="select-files">
                       <i class="item_icon file_icon icon-fixed-width"></i>
                       Files
+                      <span class="badge" id="badge-select-files"></span>
                     </label>
                   </li>
                 </ul>