[ARVADOS-WORKBENCH2] updated: 1.3.1-410-gb449a296
Git user
git at public.curoverse.com
Thu Mar 14 07:43:33 EDT 2019
Summary of changes:
src/store/search-bar/search-bar-actions.ts | 2 -
.../search-bar/search-bar-view.tsx | 114 ++++++++++++---------
2 files changed, 68 insertions(+), 48 deletions(-)
via b449a296cd8fc842ee196e1056e3be93fc9d29f5 (commit)
via 6b8e7fe8dbd6a1bbceef1acc6ebe3d8a3db1b2a4 (commit)
from ff9d56a31288124381f58f6577a490c0d6867bc3 (commit)
Those revisions listed above that are new to this repository have
not appeared on any other notification email; so we list those
revisions in full, below.
commit b449a296cd8fc842ee196e1056e3be93fc9d29f5
Merge: ff9d56a3 6b8e7fe8
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date: Thu Mar 14 12:43:11 2019 +0100
Merge branch '14917-searching-by-properties'
refs #14917
Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
commit 6b8e7fe8dbd6a1bbceef1acc6ebe3d8a3db1b2a4
Author: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
Date: Thu Mar 14 12:42:37 2019 +0100
Move search call debounce to component
Feature #14917
Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski at contractors.roche.com>
diff --git a/src/store/search-bar/search-bar-actions.ts b/src/store/search-bar/search-bar-actions.ts
index a513a6bb..bffa337b 100644
--- a/src/store/search-bar/search-bar-actions.ts
+++ b/src/store/search-bar/search-bar-actions.ts
@@ -178,7 +178,6 @@ export const changeData = (searchValue: string) =>
} else if (searchValuePresent) {
dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.AUTOCOMPLETE));
dispatch(searchBarActions.SET_SELECTED_ITEM(searchValue));
- debounceStartSearch(dispatch);
} else {
dispatch(searchBarActions.SET_CURRENT_VIEW(SearchView.BASIC));
dispatch(searchBarActions.SET_SEARCH_RESULTS([]));
@@ -199,7 +198,6 @@ export const submitData = (event: React.FormEvent<HTMLFormElement>) =>
dispatch(navigateToSearchResults);
};
-const debounceStartSearch = debounce((dispatch: Dispatch) => dispatch<any>(startSearch()), DEFAULT_SEARCH_DEBOUNCE);
const startSearch = () =>
(dispatch: Dispatch, getState: () => RootState) => {
diff --git a/src/views-components/search-bar/search-bar-view.tsx b/src/views-components/search-bar/search-bar-view.tsx
index 6251308d..176ca018 100644
--- a/src/views-components/search-bar/search-bar-view.tsx
+++ b/src/views-components/search-bar/search-bar-view.tsx
@@ -32,6 +32,7 @@ import {
SearchBarAdvancedViewActionProps
} from '~/views-components/search-bar/search-bar-advanced-view';
import { KEY_CODE_DOWN, KEY_CODE_ESC, KEY_CODE_UP, KEY_ENTER } from "~/common/codes";
+import { debounce } from 'debounce';
type CssRules = 'container' | 'containerSearchViewOpened' | 'input' | 'view';
@@ -145,52 +146,73 @@ const handleDropdownClick = (e: React.MouseEvent, props: SearchBarViewProps) =>
};
export const SearchBarView = withStyles(styles)(
- (props: SearchBarViewProps) => {
- const { classes, isPopoverOpen } = props;
- return (
- <>
-
- {isPopoverOpen &&
- <Backdrop onClick={props.closeView} />}
-
- <Paper className={isPopoverOpen ? classes.containerSearchViewOpened : classes.container} >
- <form onSubmit={props.onSubmit}>
- <Input
- className={classes.input}
- onChange={props.onChange}
- placeholder="Search"
- value={props.searchValue}
- fullWidth={true}
- disableUnderline={true}
- onClick={e => handleInputClick(e, props)}
- onKeyDown={e => handleKeyDown(e, props)}
- startAdornment={
- <InputAdornment position="start">
- <Tooltip title='Search'>
- <IconButton type="submit">
- <SearchIcon />
- </IconButton>
- </Tooltip>
- </InputAdornment>
- }
- endAdornment={
- <InputAdornment position="end">
- <Tooltip title='Advanced search'>
- <IconButton onClick={e => handleDropdownClick(e, props)}>
- <ArrowDropDownIcon />
- </IconButton>
- </Tooltip>
- </InputAdornment>
- } />
- </form>
- <div className={classes.view}>
- {isPopoverOpen && getView({ ...props })}
- </div>
- </Paper >
- </>
- );
- }
-);
+ class extends React.Component<SearchBarViewProps> {
+
+ debouncedSearch = debounce(() => {
+ this.props.onSearch(this.props.searchValue);
+ }, 1000);
+
+ handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+ this.debouncedSearch();
+ this.props.onChange(event);
+ }
+
+ handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
+ this.debouncedSearch.clear();
+ this.props.onSubmit(event);
+ }
+
+ componentWillUnmount() {
+ this.debouncedSearch.clear();
+ }
+
+ render() {
+ const { children, ...props } = this.props;
+ const { classes, isPopoverOpen } = this.props;
+ return (
+ <>
+
+ {isPopoverOpen &&
+ <Backdrop onClick={props.closeView} />}
+
+ <Paper className={isPopoverOpen ? classes.containerSearchViewOpened : classes.container} >
+ <form onSubmit={this.handleSubmit}>
+ <Input
+ className={classes.input}
+ onChange={this.handleChange}
+ placeholder="Search"
+ value={props.searchValue}
+ fullWidth={true}
+ disableUnderline={true}
+ onClick={e => handleInputClick(e, props)}
+ onKeyDown={e => handleKeyDown(e, props)}
+ startAdornment={
+ <InputAdornment position="start">
+ <Tooltip title='Search'>
+ <IconButton type="submit">
+ <SearchIcon />
+ </IconButton>
+ </Tooltip>
+ </InputAdornment>
+ }
+ endAdornment={
+ <InputAdornment position="end">
+ <Tooltip title='Advanced search'>
+ <IconButton onClick={e => handleDropdownClick(e, props)}>
+ <ArrowDropDownIcon />
+ </IconButton>
+ </Tooltip>
+ </InputAdornment>
+ } />
+ </form>
+ <div className={classes.view}>
+ {isPopoverOpen && getView({ ...props })}
+ </div>
+ </Paper >
+ </>
+ );
+ }
+ });
const getView = (props: SearchBarViewProps) => {
switch (props.currentView) {
-----------------------------------------------------------------------
hooks/post-receive
--
More information about the arvados-commits
mailing list