Remove dropdown dividers for empty filtered sections

app/ui/components/base/dropdown/dropdown.js

@@ -333,19 +333,36 @@ class Dropdown extends PureComponent {
 
     const listedChildren = Array.isArray(children) ? children : [children];
     const allChildren = this._getFlattenedChildren(listedChildren);
-    for (let i = 0; i < allChildren.length; i++) {
-      let classes = classnames({
-        active: i === filterActiveIndex,
-        hide: filterItems && !filterItems.includes(i)
-      });
 
+    const visibleChildren = allChildren.filter((child, i) => {
+      if (child.type.name !== DropdownItem.name) {
+        return true;
+      }
+
+      // It's visible if its index is in the filterItems
+      return !filterItems || filterItems.includes(i);
+    });
+
+    for (let i = 0; i < allChildren.length; i++) {
       const child = allChildren[i];
       if (child.type.name === DropdownButton.name) {
         dropdownButtons.push(child);
       } else if (child.type.name === DropdownItem.name) {
-        dropdownItems.push(<li key={i} data-filter-index={i} className={classes}>{child}</li>);
+        const active = i === filterActiveIndex;
+        const hide = !visibleChildren.includes(child);
+        dropdownItems.push(
+          <li key={i} data-filter-index={i} className={classnames({active, hide})}>
+            {child}
+          </li>
+        );
       } else if (child.type.name === DropdownDivider.name) {
-        dropdownItems.push(<li key={i}>{child}</li>);
+        const currentIndex = visibleChildren.indexOf(child);
+        const nextChild = visibleChildren[currentIndex + 1];
+
+        // Only show the divider if the next child is a DropdownItem
+        if (nextChild && nextChild.type.name === DropdownItem.name) {
+          dropdownItems.push(<li key={i}>{child}</li>);
+        }
       }
     }
 
@@ -375,7 +392,7 @@ class Dropdown extends PureComponent {
                      onKeyPress={this._handleCheckFilterSubmit}/>
             </div>
             {noResults && <div className="text-center pad faint">Nothing to show</div>}
-            <ul className={classnames({hide: noResults})}>
+            <ul className={classnames('wide', {hide: noResults})}>
               {dropdownItems}
             </ul>
           </div>