From e640f656404e49ca632de2f0f8a2164027fe3201 Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Mon, 16 May 2016 23:36:52 +0100
Subject: [PATCH] add close button to room search filter

---
 src/components/structures/SearchBox.js        | 10 ++++++++
 .../matrix-react-sdk/structures/SearchBox.css |  5 ++++
 src/skins/vector/img/icons-close.svg          | 23 +++++++++++++++++++
 3 files changed, 38 insertions(+)
 create mode 100644 src/skins/vector/img/icons-close.svg

diff --git a/src/components/structures/SearchBox.js b/src/components/structures/SearchBox.js
index a49f845ea4..9a38089e17 100644
--- a/src/components/structures/SearchBox.js
+++ b/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"
diff --git a/src/skins/vector/css/matrix-react-sdk/structures/SearchBox.css b/src/skins/vector/css/matrix-react-sdk/structures/SearchBox.css
index 93e6d7c8e8..e25928b926 100644
--- a/src/skins/vector/css/matrix-react-sdk/structures/SearchBox.css
+++ b/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 {
diff --git a/src/skins/vector/img/icons-close.svg b/src/skins/vector/img/icons-close.svg
new file mode 100644
index 0000000000..6feb660aff
--- /dev/null
+++ b/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>