From 0fbbf3d45c99486c384605d1cc286d2552dee7f1 Mon Sep 17 00:00:00 2001 From: Lucas Di Pentima Date: Mon, 18 Nov 2019 14:36:22 -0300 Subject: [PATCH] 15069: Renders property chips correctly from the search query string. We assume that property key/value strings from the search query are the concrete values from the API server, so we treat them as vocabulary IDs. Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima --- src/store/search-bar/search-bar-actions.ts | 19 +++++++++++++++---- .../search-bar/search-bar-view.tsx | 10 +++++++--- .../search-bar/search-bar.tsx | 3 ++- 3 files changed, 24 insertions(+), 8 deletions(-) diff --git a/src/store/search-bar/search-bar-actions.ts b/src/store/search-bar/search-bar-actions.ts index c4a2d45f..fbdc3995 100644 --- a/src/store/search-bar/search-bar-actions.ts +++ b/src/store/search-bar/search-bar-actions.ts @@ -23,6 +23,7 @@ import { searchResultsPanelActions } from "~/store/search-results-panel/search-r import { ListResults } from "~/services/common-service/common-service"; import * as parser from './search-query/arv-parser'; import { Keywords } from './search-query/arv-parser'; +import { Vocabulary, getTagKeyLabel, getTagValueLabel } from "~/models/vocabulary"; export const searchBarActions = unionize({ SET_CURRENT_VIEW: ofType(), @@ -95,9 +96,9 @@ export const setSearchValueFromAdvancedData = (data: SearchBarAdvanceFormData, p dispatch(searchBarActions.SET_SEARCH_VALUE(value)); }; -export const setAdvancedDataFromSearchValue = (search: string) => +export const setAdvancedDataFromSearchValue = (search: string, vocabulary: Vocabulary) => async (dispatch: Dispatch) => { - const data = getAdvancedDataFromQuery(search); + const data = getAdvancedDataFromQuery(search, vocabulary); dispatch(initialize(SEARCH_BAR_ADVANCE_FORM_NAME, data)); if (data.projectUuid) { await dispatch(activateSearchBarProject(data.projectUuid)); @@ -297,7 +298,7 @@ export const getQueryFromAdvancedData = (data: SearchBarAdvanceFormData, prevDat return value; }; -export const getAdvancedDataFromQuery = (query: string): SearchBarAdvanceFormData => { +export const getAdvancedDataFromQuery = (query: string, vocabulary?: Vocabulary): SearchBarAdvanceFormData => { const { tokens, searchString } = parser.parseSearchQuery(query); const getValue = parser.getValue(tokens); return { @@ -308,7 +309,17 @@ export const getAdvancedDataFromQuery = (query: string): SearchBarAdvanceFormDat inTrash: parser.isTrashed(tokens), dateFrom: getValue(Keywords.FROM) || '', dateTo: getValue(Keywords.TO) || '', - properties: parser.getProperties(tokens), + properties: vocabulary + ? parser.getProperties(tokens).map( + p => { + return { + keyID: p.key, + key: getTagKeyLabel(p.key, vocabulary), + valueID: p.value, + value: getTagValueLabel(p.key, p.value, vocabulary), + }; + }) + : parser.getProperties(tokens), saveQuery: false, queryName: '' }; diff --git a/src/views-components/search-bar/search-bar-view.tsx b/src/views-components/search-bar/search-bar-view.tsx index e5e52b31..49a8ba62 100644 --- a/src/views-components/search-bar/search-bar-view.tsx +++ b/src/views-components/search-bar/search-bar-view.tsx @@ -3,6 +3,7 @@ // SPDX-License-Identifier: AGPL-3.0 import * as React from 'react'; +import { compose } from 'redux'; import { IconButton, Paper, @@ -33,6 +34,8 @@ import { } 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'; +import { Vocabulary } from '~/models/vocabulary'; +import { connectVocabulary } from '../resource-properties-form/property-field-common'; type CssRules = 'container' | 'containerSearchViewOpened' | 'input' | 'view'; @@ -72,6 +75,7 @@ interface SearchBarViewDataProps { currentView: string; isPopoverOpen: boolean; debounce?: number; + vocabulary?: Vocabulary; } export type SearchBarActionProps = SearchBarViewActionProps @@ -88,7 +92,7 @@ interface SearchBarViewActionProps { loadRecentQueries: () => string[]; moveUp: () => void; moveDown: () => void; - setAdvancedDataFromSearchValue: (search: string) => void; + setAdvancedDataFromSearchValue: (search: string, vocabulary?: Vocabulary) => void; } type SearchBarViewProps = SearchBarDataProps & SearchBarActionProps & WithStyles; @@ -135,12 +139,12 @@ const handleDropdownClick = (e: React.MouseEvent, props: SearchBarViewProps) => if (props.isPopoverOpen && props.currentView === SearchView.ADVANCED) { props.closeView(); } else { - props.setAdvancedDataFromSearchValue(props.searchValue); + props.setAdvancedDataFromSearchValue(props.searchValue, props.vocabulary); props.onSetView(SearchView.ADVANCED); } }; -export const SearchBarView = withStyles(styles)( +export const SearchBarView = compose(connectVocabulary, withStyles(styles))( class extends React.Component { debouncedSearch = debounce(() => { diff --git a/src/views-components/search-bar/search-bar.tsx b/src/views-components/search-bar/search-bar.tsx index 41cf2916..78dcae61 100644 --- a/src/views-components/search-bar/search-bar.tsx +++ b/src/views-components/search-bar/search-bar.tsx @@ -20,6 +20,7 @@ import { } from '~/store/search-bar/search-bar-actions'; import { SearchBarView, SearchBarActionProps, SearchBarDataProps } from '~/views-components/search-bar/search-bar-view'; import { SearchBarAdvanceFormData } from '~/models/search-bar'; +import { Vocabulary } from '~/models/vocabulary'; const mapStateToProps = ({ searchBar, form }: RootState): SearchBarDataProps => { return { @@ -50,7 +51,7 @@ const mapDispatchToProps = (dispatch: Dispatch): SearchBarActionProps => ({ editSavedQuery: (data: SearchBarAdvanceFormData) => dispatch(editSavedQuery(data)), moveUp: () => dispatch(moveUp()), moveDown: () => dispatch(moveDown()), - setAdvancedDataFromSearchValue: (search: string) => dispatch(setAdvancedDataFromSearchValue(search)) + setAdvancedDataFromSearchValue: (search: string, vocabulary: Vocabulary) => dispatch(setAdvancedDataFromSearchValue(search, vocabulary)) }); export const SearchBar = connect(mapStateToProps, mapDispatchToProps)(SearchBarView); -- 2.30.2