Set tslint semicolon rule and aply it to the project
[arvados.git] / src / components / main-app-bar / search-bar / search-bar.tsx
index b2c95a9379a04f24454d315ecc37e12b58fa7c3e..f9e93d679c2973bf575b8e65173b028b384dbc9e 100644 (file)
@@ -3,12 +3,8 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from 'react';
-import { AppBar, Toolbar, Typography, Grid, IconButton, Badge, Paper, Input, StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core';
-import NotificationsIcon from '@material-ui/icons/Notifications';
-import PersonIcon from '@material-ui/icons/Person';
-import HelpIcon from '@material-ui/icons/Help';
+import { IconButton, Paper, StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core';
 import SearchIcon from '@material-ui/icons/Search';
-import { AppBarProps } from '@material-ui/core/AppBar';
 
 interface SearchBarDataProps {
     value: string;
@@ -19,26 +15,24 @@ interface SearchBarActionProps {
     debounce?: number;
 }
 
-type SearchBarProps = SearchBarDataProps & SearchBarActionProps & WithStyles<CssRules>
+type SearchBarProps = SearchBarDataProps & SearchBarActionProps & WithStyles<CssRules>;
 
 interface SearchBarState {
     value: string;
-    prevValue: string;
 }
 
-const DEFAULT_SEARCH_DEBOUNCE = 1000;
+export const DEFAULT_SEARCH_DEBOUNCE = 1000;
 
 class SearchBar extends React.Component<SearchBarProps> {
 
     state: SearchBarState = {
-        value: "",
-        prevValue: ""
-    }
+        value: ""
+    };
 
     timeout: NodeJS.Timer;
 
     render() {
-        const { classes } = this.props
+        const { classes } = this.props;
         return <Paper className={classes.container}>
             <form onSubmit={this.handleSubmit}>
                 <input
@@ -51,7 +45,11 @@ class SearchBar extends React.Component<SearchBarProps> {
                     <SearchIcon />
                 </IconButton>
             </form>
-        </Paper>
+        </Paper>;
+    }
+
+    componentDidMount() {
+        this.setState({value: this.props.value});
     }
 
     componentWillReceiveProps(nextProps: SearchBarProps) {
@@ -60,6 +58,10 @@ class SearchBar extends React.Component<SearchBarProps> {
         }
     }
 
+    componentWillUnmount() {
+        clearTimeout(this.timeout);
+    }
+
     handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
         event.preventDefault();
         clearTimeout(this.timeout);
@@ -78,10 +80,10 @@ class SearchBar extends React.Component<SearchBarProps> {
 
 }
 
-type CssRules = 'container' | 'input' | 'button'
+type CssRules = 'container' | 'input' | 'button';
 
 const styles: StyleRulesCallback<CssRules> = theme => {
-    const { unit } = theme.spacing
+    const { unit } = theme.spacing;
     return {
         container: {
             position: 'relative',
@@ -102,7 +104,7 @@ const styles: StyleRulesCallback<CssRules> = theme => {
             width: unit * 3,
             height: unit * 3
         }
-    }
-}
+    };
+};
 
-export default withStyles(styles)(SearchBar)
\ No newline at end of file
+export default withStyles(styles)(SearchBar);
\ No newline at end of file