diff --git a/dashboard/app/components/SideBar/SideBar.js b/dashboard/app/components/SideBar/SideBar.js index 4e67515db..7571a8b8a 100644 --- a/dashboard/app/components/SideBar/SideBar.js +++ b/dashboard/app/components/SideBar/SideBar.js @@ -21,6 +21,7 @@ export default class SideBar extends Component { constructor(props) { super(props) + this.state = {keyword: ''} if (! this.props.hasLoaded) { this.props.dispatch(appActions.fetchSideBarData(this.props.cerberusAuthToken)) } @@ -34,19 +35,26 @@ export default class SideBar extends Component { this.props.dispatch(vActions.resetVersionBrowserState()) this.props.dispatch(appActions.loadManageSDBPage(id, path, this.props.cerberusAuthToken)) } + this.handleSearchBoxChange = (event) => { + this.setState({keyword: event.target.value}) + } } render() { return (
Safe Deposit Boxes
- { sideBarContent(this.handleMouseClickAddNewBucket, this.handleSDBClicked, this.props) } + + { sideBarContent(this.handleMouseClickAddNewBucket, this.handleSDBClicked, this.props, this.state.keyword) }
) } } -const sideBarContent = (handleMouseClickAddNewBucket, handleSDBClicked, props) => { +const sideBarContent = (handleMouseClickAddNewBucket, handleSDBClicked, props, keyword) => { if (props.isFetching) { return (
@@ -57,12 +65,12 @@ const sideBarContent = (handleMouseClickAddNewBucket, handleSDBClicked, props) = return (
- {categories(handleMouseClickAddNewBucket, handleSDBClicked, props.data)} + {categories(handleMouseClickAddNewBucket, handleSDBClicked, props.data, keyword)}
) } -const categories = (handleMouseClickAddNewBucket, handleSDBClicked, data) => { +const categories = (handleMouseClickAddNewBucket, handleSDBClicked, data, keyword) => { var categories = [] for (let key in data) { if (data.hasOwnProperty(key)) { @@ -79,7 +87,7 @@ const categories = (handleMouseClickAddNewBucket, handleSDBClicked, data) => {
Create a New SDB
- {bucketComponents(category.boxes, handleSDBClicked)} + {bucketComponents(category.boxes, handleSDBClicked, keyword)} ) } @@ -87,16 +95,18 @@ const categories = (handleMouseClickAddNewBucket, handleSDBClicked, data) => { return categories } -const bucketComponents = (boxes, handleSDBClicked) => { +const bucketComponents = (boxes, handleSDBClicked, keyword) => { let bucketComponents = [] for (let box of boxes) { - bucketComponents.push( -
-
{box.name}
-
- ) + if (box.name.toLowerCase().indexOf(keyword) !== -1) { + bucketComponents.push( +
+
{box.name}
+
+ ) + } } return bucketComponents } \ No newline at end of file diff --git a/dashboard/app/components/SideBar/SideBar.scss b/dashboard/app/components/SideBar/SideBar.scss index 19e0c3a0e..30c134dcc 100644 --- a/dashboard/app/components/SideBar/SideBar.scss +++ b/dashboard/app/components/SideBar/SideBar.scss @@ -81,4 +81,8 @@ &:hover { background-color: $snkrs_off_white; } +} + +.sidebar-search-container { + padding-top: 5px; } \ No newline at end of file diff --git a/gradle.properties b/gradle.properties index 4c9c91190..fb07ce25f 100644 --- a/gradle.properties +++ b/gradle.properties @@ -14,6 +14,6 @@ # limitations under the License. # -version=3.27.1 +version=3.28.0 groupId=com.nike.cerberus artifactId=cms