X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/375bef1554bb6c85068608b7c8f6c69622c04323..6234908246415d038d74f9f0b69ab8ea886f9296:/src/views-components/search-bar/search-bar-view.tsx diff --git a/src/views-components/search-bar/search-bar-view.tsx b/src/views-components/search-bar/search-bar-view.tsx index f394084c..68418ba1 100644 --- a/src/views-components/search-bar/search-bar-view.tsx +++ b/src/views-components/search-bar/search-bar-view.tsx @@ -15,13 +15,13 @@ import { ClickAwayListener } from '@material-ui/core'; import SearchIcon from '@material-ui/icons/Search'; -import { RemoveIcon } from '~/components/icon/icon'; +import { RemoveIcon, EditSavedQueryIcon } from '~/components/icon/icon'; import { SearchView } from '~/store/search-bar/search-bar-reducer'; import { SearchBarBasicView } from '~/views-components/search-bar/search-bar-basic-view'; import { SearchBarAdvancedView } from '~/views-components/search-bar/search-bar-advanced-view'; import { SearchBarAutocompleteView, SearchBarAutocompleteViewDataProps } from '~/views-components/search-bar/search-bar-autocomplete-view'; import { ArvadosTheme } from '~/common/custom-theme'; -import { SearchBarAdvanceFormData } from '~/store/search-bar/search-bar-actions'; +import { SearchBarAdvanceFormData } from '~/models/search-bar'; type CssRules = 'container' | 'containerSearchViewOpened' | 'input' | 'view'; @@ -53,11 +53,13 @@ type SearchBarDataProps = { searchValue: string; currentView: string; isPopoverOpen: boolean; - savedQueries: string[]; + savedQueries: SearchBarAdvanceFormData[]; + tags: any; } & SearchBarAutocompleteViewDataProps; interface SearchBarActionProps { onSearch: (value: string) => any; + searchDataOnEnter: (value: string) => void; debounce?: number; onSetView: (currentView: string) => void; closeView: () => void; @@ -66,6 +68,8 @@ interface SearchBarActionProps { saveQuery: (data: SearchBarAdvanceFormData) => void; deleteSavedQuery: (id: number) => void; openSearchView: () => void; + navigateTo: (uuid: string) => void; + editSavedQuery: (data: SearchBarAdvanceFormData, id: number) => void; } type SearchBarProps = SearchBarDataProps & SearchBarActionProps & WithStyles; @@ -74,27 +78,47 @@ interface SearchBarState { value: string; } -interface RenderSavedQueriesProps { - text: string | JSX.Element; - id: number; - deleteSavedQuery: (id: number) => void; +interface RenderRecentQueriesProps { + text: string; + onSearch: (searchValue: string) => void; } -interface RenderRecentQueriesProps { +export const RenderRecentQueries = (props: RenderRecentQueriesProps) => { + return + props.onSearch(props.text)} /> + ; +}; + +interface RenderAutocompleteItemsProps { text: string | JSX.Element; + navigateTo: (uuid: string) => void; + uuid: string; } -export const RecentQueriesItem = (props: RenderRecentQueriesProps) => { +export const RenderAutocompleteItems = (props: RenderAutocompleteItemsProps) => { return - + props.navigateTo(props.uuid)} /> ; }; +interface RenderSavedQueriesProps { + text: string; + id: number; + deleteSavedQuery: (id: number) => void; + onSearch: (searchValue: string) => void; + editSavedQuery: (data: SearchBarAdvanceFormData, id: number) => void; + data: SearchBarAdvanceFormData; +} export const RenderSavedQueries = (props: RenderSavedQueriesProps) => { return - + props.onSearch(props.text)} /> + + props.editSavedQuery(props.data, props.id)}> + + + props.deleteSavedQuery(props.id)}> @@ -159,18 +183,19 @@ export const SearchBarView = withStyles(styles)( } getView = (currentView: string) => { - const { onSetView, loadRecentQueries, savedQueries, deleteSavedQuery, searchValue, searchResults, saveQuery } = this.props; + const { onSetView, loadRecentQueries, savedQueries, deleteSavedQuery, searchValue, searchResults, saveQuery, onSearch, navigateTo, editSavedQuery, tags } = this.props; switch (currentView) { case SearchView.BASIC: - return ; + return ; case SearchView.ADVANCED: - return ; + return ; case SearchView.AUTOCOMPLETE: return ; default: - return ; + return ; } } @@ -178,7 +203,7 @@ export const SearchBarView = withStyles(styles)( event.preventDefault(); clearTimeout(this.timeout); this.props.saveRecentQuery(this.state.value); - this.props.onSearch(this.state.value); + this.props.searchDataOnEnter(this.state.value); this.props.loadRecentQueries(); }