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

fix(search): update to only link title in search results

Browse Source 
Signed-off-by: Jonathan Sundquist <jonathan.sundquist@factset.com>
This commit is contained in:
Jonathan Sundquist
2022-11-14 08:51:14 -06:00
parent 50b941cf6b
commit a19cffbeed
6 changed files with 67 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/old-tips-cough.md
+9
View File
@@ -0,0 +1,9 @@
---
'@backstage/plugin-adr': patch
'@backstage/plugin-catalog': patch
'@backstage/plugin-search-react': patch
'@backstage/plugin-stack-overflow': patch
'@backstage/plugin-techdocs': patch
---
Update search links to only have header as linkable text
plugins/adr/src/search/AdrSearchResultListItem.tsx
+12 -8
View File
@@ -64,20 +64,24 @@ export function AdrSearchResultListItem(props: {
};
return (
<Link noTrack to={result.location} onClick={handleClick}>
<>
<ListItem alignItems="flex-start" className={classes.flexContainer}>
<ListItemText
className={classes.itemText}
primaryTypographyProps={{ variant: 'h6' }}
primary={
highlight?.fields.title ? (
<HighlightedSearchResultText
text={highlight.fields.title}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
<Link noTrack to={result.location} onClick={handleClick}>
<HighlightedSearchResultText
text={highlight.fields.title}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
</Link>
) : (
result.title
<Link noTrack to={result.location} onClick={handleClick}>
{result.title}
</Link>
)
}
secondary={
@@ -116,6 +120,6 @@ export function AdrSearchResultListItem(props: {
</Box>
</ListItem>
<Divider component="li" />
</Link>
</>
);
}
plugins/catalog/src/components/CatalogSearchResultListItem/CatalogSearchResultListItem.tsx
+12 -8
View File
@@ -71,7 +71,7 @@ export function CatalogSearchResultListItem(
};
return (
<Link noTrack to={result.location} onClick={handleClick}>
<>
<ListItem alignItems="flex-start">
{props.icon && <ListItemIcon>{props.icon}</ListItemIcon>}
<div className={classes.flexContainer}>
@@ -80,13 +80,17 @@ export function CatalogSearchResultListItem(
primaryTypographyProps={{ variant: 'h6' }}
primary={
props.highlight?.fields.title ? (
<HighlightedSearchResultText
text={props.highlight.fields.title}
preTag={props.highlight.preTag}
postTag={props.highlight.postTag}
/>
<Link noTrack to={result.location} onClick={handleClick}>
<HighlightedSearchResultText
text={props.highlight.fields.title}
preTag={props.highlight.preTag}
postTag={props.highlight.postTag}
/>
</Link>
) : (
result.title
<Link noTrack to={result.location} onClick={handleClick}>
{result.title}
</Link>
)
}
secondary={
@@ -112,6 +116,6 @@ export function CatalogSearchResultListItem(
</div>
</ListItem>
<Divider component="li" />
</Link>
</>
);
}
plugins/search-react/src/components/DefaultResultListItem/DefaultResultListItem.tsx
+12 -8
View File
@@ -66,20 +66,24 @@ export const DefaultResultListItemComponent = ({
};
return (
<Link noTrack to={result.location} onClick={handleClick}>
<>
<ListItem alignItems="center">
{icon && <ListItemIcon>{icon}</ListItemIcon>}
<ListItemText
primaryTypographyProps={{ variant: 'h6' }}
primary={
highlight?.fields.title ? (
<HighlightedSearchResultText
text={highlight.fields.title}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
<Link noTrack to={result.location} onClick={handleClick}>
<HighlightedSearchResultText
text={highlight.fields.title}
preTag={highlight.preTag}
postTag={highlight.postTag}
/>
</Link>
) : (
result.title
<Link noTrack to={result.location} onClick={handleClick}>
{result.title}
</Link>
)
}
secondary={
@@ -106,7 +110,7 @@ export const DefaultResultListItemComponent = ({
{secondaryAction && <Box alignItems="flex-end">{secondaryAction}</Box>}
</ListItem>
<Divider />
</Link>
</>
);
};
plugins/stack-overflow/src/search/StackOverflowSearchResultListItem/StackOverflowSearchResultListItem.tsx
+7 -3
View File
@@ -47,13 +47,17 @@ export const StackOverflowSearchResultListItem = (
};
return (
<Link to={location} noTrack onClick={handleClick}>
<>
<ListItem alignItems="center">
{props.icon && <ListItemIcon>{props.icon}</ListItemIcon>}
<Box flexWrap="wrap">
<ListItemText
primaryTypographyProps={{ variant: 'h6' }}
primary={_unescape(title)}
primary={
<Link to={location} noTrack onClick={handleClick}>
{_unescape(title)}
</Link>
}
secondary={`Author: ${text}`}
/>
<Chip label={`Answer(s): ${answers}`} size="small" />
@@ -64,6 +68,6 @@ export const StackOverflowSearchResultListItem = (
</Box>
</ListItem>
<Divider />
</Link>
</>
);
};
plugins/techdocs/src/search/components/TechDocsSearchResultListItem.tsx
+15 -17
View File
@@ -81,6 +81,15 @@ export const TechDocsSearchResultListItem = (
});
};
const LinkWrapper = ({ children }: PropsWithChildren<{}>) =>
asLink ? (
<Link noTrack to={result.location} onClick={handleClick}>
{children}
</Link>
) : (
<>{children}</>
);
const TextItem = () => {
const resultTitle = highlight?.fields.title ? (
<HighlightedSearchResultText
@@ -118,11 +127,11 @@ export const TechDocsSearchResultListItem = (
primaryTypographyProps={{ variant: 'h6' }}
primary={
title ? (
title
<LinkWrapper>{title}</LinkWrapper>
) : (
<>
<LinkWrapper>
{resultTitle} | {entityTitle ?? resultName} docs
</>
</LinkWrapper>
)
}
secondary={
@@ -149,15 +158,6 @@ export const TechDocsSearchResultListItem = (
);
};
const LinkWrapper = ({ children }: PropsWithChildren<{}>) =>
asLink ? (
<Link noTrack to={result.location} onClick={handleClick}>
{children}
</Link>
) : (
<>{children}</>
);
const ListItemWrapper = ({ children }: PropsWithChildren<{}>) =>
asListItem ? (
<>
@@ -172,10 +172,8 @@ export const TechDocsSearchResultListItem = (
);
return (
<LinkWrapper>
<ListItemWrapper>
<TextItem />
</ListItemWrapper>
</LinkWrapper>
<ListItemWrapper>
<TextItem />
</ListItemWrapper>
);
};