add close button to room search filter

src/components/structures/SearchBox.js

@@ -81,6 +81,16 @@ module.exports = React.createClass({
         var searchControls;
         if (!this.props.collapsed) {
             searchControls = [
+                    this.state.searchTerm.length > 0 ?
+                    <div key="button"
+                         className="mx_SearchBox_closeButton"
+                         onClick={ ()=>{ this.refs.search.value = ""; this.onChange(); } }>
+                        <TintableSvg
+                            className="mx_SearchBox_searchButton"
+                            src="img/icons-close.svg" width="24" height="24"
+                        />
+                    </div>
+                    :
                     <TintableSvg
                         key="button"
                         className="mx_SearchBox_searchButton"

src/skins/vector/css/matrix-react-sdk/structures/SearchBox.css

@@ -28,6 +28,11 @@ limitations under the License.
 
 .mx_SearchBox_searchButton {
     margin-right: 10px;
+    pointer-events: none;
+}
+
+.mx_SearchBox_closeButton {
+    cursor: pointer;
 }
 
 .mx_SearchBox_search {

src/skins/vector/img/icons-close.svg

@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-11 13 24 24" xml:space="preserve">
+<style type="text/css">
+	.st1{fill:none;stroke:#FFFFFF;stroke-width:2;stroke-linecap:round;}
+</style>
+<title>icons_create_room</title>
+<desc>Created with sketchtool.</desc>
+<g id="_x30_3-Input" sketch:type="MSPage">
+	<g id="_x30_3_x5F_4-Uploading" transform="translate(-20.000000, -726.000000)" sketch:type="MSArtboardGroup">
+		<g id="Room-list" sketch:type="MSLayerGroup">
+			<g id="Room-list_x2F_Footer" transform="translate(0.000000, 708.000000)" sketch:type="MSShapeGroup">
+				<g id="icons_create_room" transform="translate(20.000000, 18.000000)">
+					<circle id="Oval-1-Copy-7" fill="#76CFA6" cx="1" cy="25" r="12"/>
+					<path id="Line" class="st1" d="M-2.5,28.5l7.1-7.1"/>
+					<path id="Line_1_" class="st1" d="M-2.5,21.5l7.1,7.1"/>
+				</g>
+			</g>
+		</g>
+	</g>
+</g>
+</svg>