message: Reorganise room directory code so new room is always available
  This reorganises the room directory so that the new room buttons is always
  available no matter what state the overall directory is in.
  Part of
diff: @@ -515,20 +515,9 @@ module.exports = React.createClass({
  const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
  const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
  - // TODO: clean this up
  - if (this.state.protocolsLoading) {
  - return (
  - <div className="mx_RoomDirectory">
  - <Loader />
  - </div>
  - );
  - }
  -
  let content;
  - if (this.state.loading) {
  - content = <div className="mx_RoomDirectory">
  - <Loader />
  - </div>;
  + if (this.state.protocolsLoading || this.state.loading) {
  + content = <Loader />;
  } else {
  const rows = this.getRows();
  // we still show the scrollpanel, at least for now, because
  @@ -556,6 +545,11 @@ module.exports = React.createClass({
  </ScrollPanel>;
  }
  + let listHeader;
  + if (!this.state.protocolsLoading) {
  + const NetworkDropdown = sdk.getComponent('directory.NetworkDropdown');
  + const DirectorySearchBox = sdk.getComponent('elements.DirectorySearchBox');
  +
  const protocolName = protocolNameForInstanceId(this.protocols, this.state.instanceId);
  let instance_expected_field_type;
  if (
  @@ -585,13 +579,21 @@ module.exports = React.createClass({
  }
  }
  + listHeader = <div className="mx_RoomDirectory_listheader">
  + <DirectorySearchBox
  + className="mx_RoomDirectory_searchbox"
  + onChange={this.onFilterChange} onClear={this.onFilterClear} onJoinClick={this.onJoinClick}
  + placeholder={placeholder} showJoinButton={showJoinButton}
  + />
  + <NetworkDropdown config={this.props.config} protocols={this.protocols} onOptionChange={this.onOptionChange} />
  + </div>;
  + }
  +
  const createRoomButton = (<AccessibleButton
  onClick={this.onCreateRoomClicked}
  className="mx_RoomDirectory_createRoom"
  >{_t("Create new room")}</AccessibleButton>);
  - const NetworkDropdown = sdk.getComponent('directory.NetworkDropdown');
  - const DirectorySearchBox = sdk.getComponent('elements.DirectorySearchBox');
  return (
  <BaseDialog
  className={'mx_RoomDirectory_dialog'}
  @@ -602,14 +604,7 @@ module.exports = React.createClass({
  >
  <div className="mx_RoomDirectory">
  <div className="mx_RoomDirectory_list">
  - <div className="mx_RoomDirectory_listheader">
  - <DirectorySearchBox
  - className="mx_RoomDirectory_searchbox"
  - onChange={this.onFilterChange} onClear={this.onFilterClear} onJoinClick={this.onJoinClick}
  - placeholder={placeholder} showJoinButton={showJoinButton}
  - />
  - <NetworkDropdown config={this.props.config} protocols={this.protocols} onOptionChange={this.onOptionChange} />
  - </div>
  + {listHeader}
  {content}
  </div>
  </div>
  