// 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;
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
<SearchIcon />
</IconButton>
</form>
- </Paper>
+ </Paper>;
+ }
+
+ componentDidMount() {
+ this.setState({value: this.props.value});
}
componentWillReceiveProps(nextProps: SearchBarProps) {
}
}
+ componentWillUnmount() {
+ clearTimeout(this.timeout);
+ }
+
handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
event.preventDefault();
clearTimeout(this.timeout);
}
-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',
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