Search results: add a message for when the display limit is hit (#60220)

This commit is contained in:
Camden Cheek 2024-02-07 21:34:08 -07:00 committed by GitHub
parent ecc518b0fe
commit 941a7a67f6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 49 additions and 38 deletions

View File

@ -14,42 +14,53 @@ export const StreamingSearchResultFooter: React.FunctionComponent<
results?: AggregateStreamingSearchResults
children?: React.ReactChild | React.ReactChild[]
}>
> = ({ results, children }) => (
<div className={classNames(styles.contentCentered, 'd-flex flex-column align-items-center')}>
{(!results || results?.state === 'loading') && (
<div className="text-center my-4" data-testid="loading-container">
<LoadingSpinner />
</div>
)}
> = ({ results, children }) => {
const skippedDisplay =
results?.state === 'complete' && results.progress.skipped.find(skipped => skipped.reason.includes('display'))
const resultLimitHit =
results?.state === 'complete' && results.progress.skipped.some(skipped => skipped.reason.includes('-limit'))
{results?.state === 'complete' && results?.results.length > 0 && (
<StreamingProgressCount progress={results.progress} state={results.state} className="mt-4 mb-2" />
)}
{results?.state === 'error' && (
<ErrorAlert className="m-3" data-testid="search-results-list-error" error={results.error} />
)}
{results?.state === 'complete' && !results.alert && results?.results.length === 0 && (
<div className="pr-3 mt-3 align-self-stretch">
<Alert variant="info">
<H3 as={H2} className="m-0 py-1">
No results matched your search.
</H3>
</Alert>
</div>
)}
{results?.state === 'complete' &&
results.progress.skipped.some(skipped => skipped.reason.includes('-limit')) && (
<Alert className="d-flex m-3" variant="info">
<Text className="m-0">
<strong>Result limit hit.</strong> Modify your search with <Code>count:</Code> to return
additional items.
</Text>
</Alert>
return (
<div className={classNames(styles.contentCentered, 'd-flex flex-column align-items-center')}>
{(!results || results?.state === 'loading') && (
<div className="text-center my-4" data-testid="loading-container">
<LoadingSpinner />
</div>
)}
{children}
</div>
)
{results?.state === 'complete' && results?.results.length > 0 && (
<StreamingProgressCount progress={results.progress} state={results.state} className="mt-4 mb-2" />
)}
{results?.state === 'error' && (
<ErrorAlert className="m-3" data-testid="search-results-list-error" error={results.error} />
)}
{results?.state === 'complete' && !results.alert && results?.results.length === 0 && (
<div className="pr-3 mt-3 align-self-stretch">
<Alert variant="info">
<H3 as={H2} className="m-0 py-1">
No results matched your search.
</H3>
</Alert>
</div>
)}
{(skippedDisplay || resultLimitHit) && (
<Alert className="d-flex flex-column m-3" variant="info">
{skippedDisplay && (
<Text className="m-0">
<strong>Display limit hit.</strong> {skippedDisplay.message}
</Text>
)}
{resultLimitHit && (
<Text className="m-0">
<strong>Result limit hit.</strong> Modify your query with <Code>count:</Code> to search for
more items.
</Text>
)}
</Alert>
)}
</div>
)
}

View File

@ -178,7 +178,7 @@ func TestDisplayLimit(t *testing.T) {
displayLimit: 1,
wantDisplayLimitHit: true,
wantMatchCount: 2,
wantMessage: "We only display 1 result even if your search returned more results. To see all results and configure the display limit, use our CLI.",
wantMessage: "We only display 1 result even if your search returned more results. To see all results, use our CLI.",
},
{
queryString: "foo count:2",

View File

@ -130,7 +130,7 @@ func displayLimitHandler(resultsResolver ProgressStats) (Skipped, bool) {
return Skipped{
Reason: DisplayLimit,
Title: "display limit hit",
Message: fmt.Sprintf("We only display %d %s even if your search returned more results. To see all results and configure the display limit, use our CLI.", resultsResolver.DisplayLimit, result),
Message: fmt.Sprintf("We only display %d %s even if your search returned more results. To see all results, use our CLI.", resultsResolver.DisplayLimit, result),
Severity: SeverityInfo,
}, true
}