fix broken rendering

client/components/filters/editor.jsx

@@ -71,32 +71,26 @@ class FiltersEditor extends React.Component {
     if (!hasFilters(this.props.available) && !hasFilters(this.props.applied)) {
       return null;
     }
+    /*
 
+
+    */
     return (
       <div className="card lookup-filters-editor">
-        {this.props.availableSources.length > 0 && <h2>Route server</h2>}
         <RouteserversSelect onChange={(value) => this.addFilter(FILTER_GROUP_SOURCES, value)}
                             onRemove={(value) => this.removeFilter(FILTER_GROUP_SOURCES, value)}
                             available={this.props.availableSources}
                             applied={this.props.appliedSources} />
 
-        {this.props.availableAsns.length > 0 && <h2>Neighbor</h2>}
         <PeersFilterSelect onChange={(value) => this.addFilter(FILTER_GROUP_ASNS, value)}
                            onRemove={(value) => this.removeFilter(FILTER_GROUP_ASNS, value)}
                            available={this.props.availableAsns}
                            applied={this.props.appliedAsns} />
 
-        {(this.props.availableCommunities.communities.length > 0 ||
-         this.props.availableCommunities.ext.length > 0 ||
-         this.props.availableCommunities.large.length > 0 ||
-         this.props.appliedCommunities.communities.length > 0 ||
-         this.props.appliedCommunities.ext.length > 0 ||
-         this.props.appliedCommunities.large.length > 0) && <h2>Communities</h2>}
         <CommunitiesSelect onChange={(group, value) => this.addFilter(group, value)}
                            onRemove={(group, value) => this.removeFilter(group, value)}
                            available={this.props.availableCommunities}
                            applied={this.props.appliedCommunities} />
-
       </div>
     );
   }

client/components/filters/widgets.jsx

@@ -15,7 +15,26 @@ import {FILTER_GROUP_COMMUNITIES,
  from './groups'
 
 
-export class RouteserversSelect extends React.Component {
+/*
+ * Add a title to the widget, if something needs to be rendered
+ */
+const withTitle = (title) => (Widget) => (class WidgetWithTitle extends Widget {
+  render() {
+    const result = super.render();
+    if (result == null) {
+      return null;
+    }
+    return (
+      <div className="filter-editor-widget">
+        <h2>{title}</h2>
+        {result}
+      </div>
+    )
+  }
+});
+
+
+class _RouteserversSelect extends React.Component {
   render() {
     // Nothing to do if we don't have filters
     if (this.props.available.length == 0 &&
@@ -82,8 +101,10 @@ export class RouteserversSelect extends React.Component {
   }
 }
 
+export const RouteserversSelect = withTitle("Route Server")(_RouteserversSelect);
 
-export class PeersFilterSelect extends React.Component {
+
+class _PeersFilterSelect extends React.Component {
   render() {
     // Nothing to do if we don't have filters
     if (this.props.available.length == 0 &&
@@ -151,8 +172,10 @@ export class PeersFilterSelect extends React.Component {
   }
 }
 
+export const PeersFilterSelect = withTitle("Neighbor")(_PeersFilterSelect);
 
-class _CommunitiesSelect extends React.Component {
+
+class __CommunitiesSelect extends React.Component {
   propagateChange(value) {
     // Decode value
     const [group, community] = value.split(",", 2);
@@ -292,11 +315,12 @@ class _CommunitiesSelect extends React.Component {
   }
 }
 
-export const CommunitiesSelect = connect(
+const _CommunitiesSelect = connect(
   (state) => ({
     communities: state.config.bgp_communities,
   })
-)(_CommunitiesSelect);
-
+)(__CommunitiesSelect);
+
+export const CommunitiesSelect = withTitle("Communities")(_CommunitiesSelect);
 
 

client/components/routeservers/routes/reducer.jsx

@@ -115,6 +115,7 @@ function _handleFetchRoutesRequest(type, state, payload) {
   const nextState = Object.assign({}, state, {
     [stype+'Loading']: true,
     [stype+'Requested']: true,
+    [stype+'FiltersAvailable']: initialFilterState,
   });
 
   return nextState;