Skip to content

Commit e759d37

Browse files
EbonsignoriCopilot
Ebonsignori
and
Copilot
authored
show general search results in Copilot Search states (#56242)
Co-authored-by: Copilot <[email protected]>
1 parent 6acf386 commit e759d37

File tree

2 files changed

+87
-86
lines changed

2 files changed

+87
-86
lines changed

‎src/search/components/input/AskAIResults.tsx‎

Lines changed: 48 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -381,54 +381,6 @@ export function AskAIResults({
381381

382382
return (
383383
<div id="ask-ai-result-container" role="region" className={styles.container}>
384-
{!aiCouldNotAnswer && references && references.length > 0 ? (
385-
<>
386-
<ActionList className={styles.referencesList} showDividers>
387-
<ActionList.Group>
388-
<ActionList.GroupHeading
389-
as="h3"
390-
aria-label={t('search.ai.references')}
391-
className={styles.referencesTitle}
392-
>
393-
{t('search.ai.references')}
394-
</ActionList.GroupHeading>
395-
{references
396-
.map((source, index) => {
397-
if (index >= MAX_REFERENCES_TO_SHOW) {
398-
return null
399-
}
400-
const refIndex = index + referencesIndexOffset
401-
return (
402-
<ActionList.Item
403-
sx={{
404-
marginLeft: '0px',
405-
}}
406-
key={`reference-${index}`}
407-
id={`search-option-reference-${index + referencesIndexOffset}`}
408-
tabIndex={-1}
409-
onSelect={() => {
410-
referenceOnSelect(source.url)
411-
}}
412-
active={refIndex === selectedIndex}
413-
ref={(element) => {
414-
if (listElementsRef.current) {
415-
listElementsRef.current[refIndex] = element
416-
}
417-
}}
418-
>
419-
<ActionList.LeadingVisual aria-hidden="true">
420-
<FileIcon />
421-
</ActionList.LeadingVisual>
422-
{source.title}
423-
</ActionList.Item>
424-
)
425-
})
426-
.filter(Boolean)}
427-
</ActionList.Group>
428-
<ActionList.Divider aria-hidden="true" />
429-
</ActionList>
430-
</>
431-
) : null}
432384
<ActionList.GroupHeading
433385
key="ai-heading"
434386
as="h3"
@@ -529,6 +481,54 @@ export function AskAIResults({
529481
></IconButton>
530482
</div>
531483
) : null}
484+
{!aiCouldNotAnswer && references && references.length > 0 ? (
485+
<>
486+
<ActionList.Divider aria-hidden="true" />
487+
<ActionList className={styles.referencesList} showDividers>
488+
<ActionList.Group>
489+
<ActionList.GroupHeading
490+
as="h3"
491+
aria-label={t('search.ai.references')}
492+
className={styles.referencesTitle}
493+
>
494+
{t('search.ai.references')}
495+
</ActionList.GroupHeading>
496+
{references
497+
.map((source, index) => {
498+
if (index >= MAX_REFERENCES_TO_SHOW) {
499+
return null
500+
}
501+
const refIndex = index + referencesIndexOffset
502+
return (
503+
<ActionList.Item
504+
sx={{
505+
marginLeft: '0px',
506+
}}
507+
key={`reference-${index}`}
508+
id={`search-option-reference-${index + referencesIndexOffset}`}
509+
tabIndex={-1}
510+
onSelect={() => {
511+
referenceOnSelect(source.url)
512+
}}
513+
active={refIndex === selectedIndex}
514+
ref={(element) => {
515+
if (listElementsRef.current) {
516+
listElementsRef.current[refIndex] = element
517+
}
518+
}}
519+
>
520+
<ActionList.LeadingVisual aria-hidden="true">
521+
<FileIcon />
522+
</ActionList.LeadingVisual>
523+
{source.title}
524+
</ActionList.Item>
525+
)
526+
})
527+
.filter(Boolean)}
528+
</ActionList.Group>
529+
</ActionList>
530+
</>
531+
) : null}
532532
<div
533533
aria-live="assertive"
534534
style={{

‎src/search/components/input/SearchOverlay.tsx‎

Lines changed: 39 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -266,12 +266,12 @@ export function SearchOverlay({
266266

267267
// Fetch initial search results on open
268268
useEffect(() => {
269-
if (searchOverlayOpen && (!isAskAIState || aiSearchError || aiCouldNotAnswer)) {
269+
if (searchOverlayOpen) {
270270
if (!searchEventGroupId.current) {
271271
searchEventGroupId.current = uuidv4()
272272
}
273273
updateAutocompleteResults(urlSearchInputQuery)
274-
} else if (isAskAIState || aiSearchError || aiCouldNotAnswer) {
274+
} else {
275275
// When opening the overlay via query params, we don't need to fetch autocomplete results
276276
// However, on initial open, we need to clear the loading state
277277
setSearchLoading(false)
@@ -628,7 +628,10 @@ export function SearchOverlay({
628628
/>
629629
</Box>
630630
</li>
631-
<ActionList.Divider key="error-bottom-divider" />
631+
{/* If there are general results, show bottom divider */}
632+
{generalOptionsWithViewStatus.length > 0 && (
633+
<ActionList.Divider key="error-middle-divider" />
634+
)}
632635
</>
633636
)}
634637
{renderSearchGroups(
@@ -885,36 +888,8 @@ function renderSearchGroups(
885888
const groups = []
886889

887890
let isInAskAIState = askAIState?.isAskAIState && !askAIState.aiSearchError
888-
if (isInAskAIState) {
889-
groups.push(
890-
<ActionList.Group key="ai" data-testid="ask-ai">
891-
<li tabIndex={-1}>
892-
<AskAIResults
893-
query={askAIState.aiQuery}
894-
debug={askAIState.debug}
895-
version={askAIState.currentVersion}
896-
setAISearchError={askAIState.setAISearchError}
897-
references={askAIState.references}
898-
setReferences={askAIState.setReferences}
899-
referencesIndexOffset={askAIState.referencesIndexOffset}
900-
referenceOnSelect={askAIState.referenceOnSelect}
901-
selectedIndex={selectedIndex}
902-
askAIEventGroupId={askAIState.askAIEventGroupId}
903-
aiCouldNotAnswer={askAIState.aiCouldNotAnswer}
904-
setAICouldNotAnswer={askAIState.setAICouldNotAnswer}
905-
listElementsRef={listElementsRef}
906-
/>
907-
</li>
908-
</ActionList.Group>,
909-
)
910-
}
911-
912891
let isInAskAIStateButNoAnswer = isInAskAIState && askAIState.aiCouldNotAnswer
913892

914-
if (isInAskAIStateButNoAnswer) {
915-
groups.push(<ActionList.Divider key="no-answer-divider" />)
916-
}
917-
918893
// already showing spinner when streaming AI response, so don't want to show 2 here
919894
if (showSpinner && !isInAskAIState) {
920895
groups.push(
@@ -932,8 +907,8 @@ function renderSearchGroups(
932907
return groups
933908
}
934909

935-
// We want to show general search suggestions underneath the AI Response section if the AI Could no answer
936-
if ((generalSearchOptions.length && !isInAskAIState) || isInAskAIStateButNoAnswer) {
910+
// We want to show general search suggestions above the AI Response section if the AI could not answer
911+
if (generalSearchOptions.length || isInAskAIStateButNoAnswer) {
937912
const items = []
938913
for (let index = 0; index < generalSearchOptions.length; index++) {
939914
const option = generalSearchOptions[index]
@@ -1034,17 +1009,43 @@ function renderSearchGroups(
10341009
</ActionList.Group>,
10351010
)
10361011

1012+
if (isInAskAIState || isInAskAIStateButNoAnswer) {
1013+
groups.push(<ActionList.Divider key="no-answer-divider" />)
1014+
}
1015+
1016+
if (isInAskAIState) {
1017+
groups.push(
1018+
<ActionList.Group key="ai" data-testid="ask-ai">
1019+
<li tabIndex={-1}>
1020+
<AskAIResults
1021+
query={askAIState.aiQuery}
1022+
debug={askAIState.debug}
1023+
version={askAIState.currentVersion}
1024+
setAISearchError={askAIState.setAISearchError}
1025+
references={askAIState.references}
1026+
setReferences={askAIState.setReferences}
1027+
referencesIndexOffset={askAIState.referencesIndexOffset}
1028+
referenceOnSelect={askAIState.referenceOnSelect}
1029+
selectedIndex={selectedIndex}
1030+
askAIEventGroupId={askAIState.askAIEventGroupId}
1031+
aiCouldNotAnswer={askAIState.aiCouldNotAnswer}
1032+
setAICouldNotAnswer={askAIState.setAICouldNotAnswer}
1033+
listElementsRef={listElementsRef}
1034+
/>
1035+
</li>
1036+
</ActionList.Group>,
1037+
)
1038+
}
1039+
10371040
// Don't show the bottom divider if:
10381041
// 1. We are in the AI could not answer state
10391042
// 2. We are in the AI Search error state
10401043
// 3. There are no AI suggestions to show in suggestions state
10411044
if (
1042-
!askAIState.aiCouldNotAnswer &&
1045+
!isInAskAIState &&
10431046
!askAIState.aiSearchError &&
1044-
(!askAIState.isAskAIState ||
1045-
generalSearchOptions.filter(
1046-
(option) => !option.isViewAllResults && !option.isNoResultsFound,
1047-
).length) &&
1047+
generalSearchOptions.filter((option) => !option.isViewAllResults && !option.isNoResultsFound)
1048+
.length &&
10481049
aiOptionsWithUserInput.length
10491050
) {
10501051
groups.push(<ActionList.Divider key="bottom-divider" />)

0 commit comments

Comments
 (0)