X-Git-Url: https://git.arvados.org/arvados-workbench2.git/blobdiff_plain/b8a54f4563eb3bbe73226a8f22c04a98a1cba039..dec2560060035f165662cff34b3a8916927a7ee6:/src/views-components/search-bar/search-bar-recent-queries.tsx

diff --git a/src/views-components/search-bar/search-bar-recent-queries.tsx b/src/views-components/search-bar/search-bar-recent-queries.tsx
index 3de3ca7a..1d5c46c8 100644
--- a/src/views-components/search-bar/search-bar-recent-queries.tsx
+++ b/src/views-components/search-bar/search-bar-recent-queries.tsx
@@ -2,9 +2,10 @@
 //
 // SPDX-License-Identifier: AGPL-3.0
 
-import * as React from 'react';
+import React from 'react';
 import { withStyles, WithStyles, StyleRulesCallback, List, ListItem, ListItemText } from '@material-ui/core';
-import { ArvadosTheme } from '~/common/custom-theme';
+import { ArvadosTheme } from 'common/custom-theme';
+import { SearchBarSelectedItem } from "store/search-bar/search-bar-reducer";
 
 type CssRules = 'root' | 'listItem' | 'listItemText';
 
@@ -22,22 +23,26 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     }
 });
 
+export interface SearchBarRecentQueriesDataProps {
+    selectedItem: SearchBarSelectedItem;
+}
+
 export interface SearchBarRecentQueriesActionProps {
     onSearch: (searchValue: string) => void;
     loadRecentQueries: () => string[];
 }
 
-type SearchBarRecentQueriesProps = SearchBarRecentQueriesActionProps & WithStyles<CssRules>;
+type SearchBarRecentQueriesProps = SearchBarRecentQueriesDataProps & SearchBarRecentQueriesActionProps & WithStyles<CssRules>;
 
 export const SearchBarRecentQueries = withStyles(styles)(
-    ({ classes, onSearch, loadRecentQueries }: SearchBarRecentQueriesProps) =>
+    ({ classes, onSearch, loadRecentQueries, selectedItem }: SearchBarRecentQueriesProps) =>
         <List component="nav" className={classes.root}>
             {loadRecentQueries().map((query, index) =>
-                <ListItem button key={index} className={classes.listItem}>
-                    <ListItemText disableTypography 
-                        secondary={query} 
-                        onClick={() => onSearch(query)} 
+                <ListItem button key={index} className={classes.listItem} selected={`RQ-${index}-${query}` === selectedItem.id}>
+                    <ListItemText disableTypography
+                        secondary={query}
+                        onClick={() => onSearch(query)}
                         className={classes.listItemText} />
                 </ListItem>
             )}
-        </List>);
\ No newline at end of file
+        </List>);