paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 31 Packages Projects Releases Wiki Activity

make sure result list is structured with list elements only

Browse Source 
Signed-off-by: Emma Indal <emma.indahl@gmail.com>
This commit is contained in:
Emma Indal
2023-01-20 16:23:23 +01:00
parent 9dd6a59651
commit a0619a5b49
5 changed files with 119 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.tsx
+43 -51
View File
@@ -21,13 +21,7 @@ import {
SearchDocument,
} from '@backstage/plugin-search-common';
import { HighlightedSearchResultText } from '../HighlightedSearchResultText';
import {
ListItem,
ListItemIcon,
ListItemText,
Box,
Divider,
} from '@material-ui/core';
import { ListItem, ListItemIcon, ListItemText, Box } from '@material-ui/core';
import Typography from '@material-ui/core/Typography';
import { Link } from '@backstage/core-components';
@@ -43,6 +37,7 @@ export type DefaultResultListItemProps = {
highlight?: ResultHighlight;
rank?: number;
lineClamp?: number;
toggleModal?: () => void;
};
/**
@@ -60,50 +55,47 @@ export const DefaultResultListItemComponent = ({
if (!result) return null;
return (
<>
<ListItem alignItems="center">
{icon && <ListItemIcon>{icon}</ListItemIcon>}
<ListItemText
primaryTypographyProps={{ variant: 'h6' }}
primary={
<Link noTrack to={result.location}>
{highlight?.fields.title ? (
<HighlightedSearchResultText
text={highlight?.fields.title || ''}
preTag={highlight?.preTag || ''}
postTag={highlight?.postTag || ''}
/>
) : (
result.title
)}
</Link>
}
secondary={
<Typography
component="span"
style={{
display: '-webkit-box',
WebkitBoxOrient: 'vertical',
WebkitLineClamp: lineClamp,
overflow: 'hidden',
}}
>
{highlight?.fields.text ? (
<HighlightedSearchResultText
text={highlight.fields.text}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
) : (
result.text
)}
</Typography>
}
/>
{secondaryAction && <Box alignItems="flex-end">{secondaryAction}</Box>}
</ListItem>
<Divider />
</>
<ListItem alignItems="center" divider>
{icon && <ListItemIcon>{icon}</ListItemIcon>}
<ListItemText
primaryTypographyProps={{ variant: 'h6' }}
primary={
<Link noTrack to={result.location}>
{highlight?.fields.title ? (
<HighlightedSearchResultText
text={highlight?.fields.title || ''}
preTag={highlight?.preTag || ''}
postTag={highlight?.postTag || ''}
/>
) : (
result.title
)}
</Link>
}
secondary={
<Typography
component="span"
style={{
display: '-webkit-box',
WebkitBoxOrient: 'vertical',
WebkitLineClamp: lineClamp,
overflow: 'hidden',
}}
>
{highlight?.fields.text ? (
<HighlightedSearchResultText
text={highlight.fields.text}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
) : (
result.text
)}
</Typography>
}
/>
{secondaryAction && <Box alignItems="flex-end">{secondaryAction}</Box>}
</ListItem>
);
};