- ({ classes, searchResults, searchValue, navigateTo }: SearchBarAutocompleteViewProps) =>
- <Paper className={classes.searchView}>
- {searchResults && <List component="nav" className={classes.list}>
- {searchResults.map((item: GroupContentsResource) => {
- return <RenderAutocompleteItems key={item.uuid} text={getFormattedText(item.name, searchValue)} navigateTo={navigateTo} uuid={item.uuid} />;
- })}
- </List>}
- </Paper>
-);
+ ({ classes, searchResults, searchValue, navigateTo, selectedItem }: SearchBarAutocompleteViewProps) => {
+ return <Paper className={classes.searchView}>
+ <List component="nav" className={classes.list}>
+ <ListItem button className={classes.listItem} selected={!selectedItem || searchValue === selectedItem.id}>
+ <ListItemText secondary={searchValue}/>
+ </ListItem>
+ {searchResults.map((item: GroupContentsResource) =>
+ <ListItem button key={item.uuid} className={classes.listItem} selected={item.uuid === selectedItem.id}>
+ <ListItemText secondary={getFormattedText(item.name, searchValue)}
+ onClick={() => navigateTo(item.uuid)}/>
+ </ListItem>
+ )}
+ </List>
+ </Paper>;
+ });