Browser: Update UI with new components and elements (#5671)

browser/app/js/buckets/BucketSearch.js

@@ -19,17 +19,17 @@ import { connect } from "react-redux"
 import * as actionsBuckets from "./actions"
 
 export const BucketSearch = ({ onChange }) => (
-  <div
-    className="input-group ig-dark ig-left ig-search"
-    style={{ display: "block" }}
-  >
-    <input
-      className="ig-text"
-      type="text"
-      onChange={e => onChange(e.target.value)}
-      placeholder="Search Buckets..."
-    />
-    <i className="ig-helpers" />
+  <div className="buckets__search">
+    <div className="form-group form-group--icon">
+      <i className="form-group__icon zmdi zmdi-search" />
+      <input
+        className="form-group__field"
+        type="text"
+        onChange={e => onChange(e.target.value)}
+        placeholder="Search Buckets..."
+      />
+      <i className="form-group__helper" />
+    </div>
   </div>
 )
 
@@ -37,7 +37,7 @@ const mapDispatchToProps = dispatch => {
   return {
     onChange: filter => {
       dispatch(actionsBuckets.setFilter(filter))
-    }
+    },
   }
 }