Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix bug #3676 : Display consistent search history for Search documentation and Search resources. #3854

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion components/AlgoliaSearch.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ function AlgoliaModal({ onClose, initialQuery, indexName }: AlgoliaModalProps) {
}}
placeholder={indexName === DOCS_INDEX_NAME ? 'Search documentation' : 'Search resources'}
onClose={onClose}
indexName={indexName}
indexName={INDEX_NAME}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Critical fix for search history consistency.

This is the core change that standardizes the search index. By forcing the DocSearchModal to always use INDEX_NAME instead of the passed indexName parameter, all search components will now share the same search history.

It's worth noting that this change means the placeholder prop (in line 123) may show different text than what's being searched, as it still uses the passed indexName to determine whether to show "Search documentation" or "Search resources".

apiKey={API_KEY}
appId={APP_ID}
navigator={{
Expand Down
4 changes: 2 additions & 2 deletions components/navigation/DocsMobileMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import React from 'react';

import type { IDoc } from '@/types/post';

import { DOCS_INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import { INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import ClickableLogo from '../ClickableLogo';
import IconLoupe from '../icons/Loupe';
import DocsNav from './DocsNav';
Expand Down Expand Up @@ -48,7 +48,7 @@ export default function DocsMobileMenu({ post, navigation, onClickClose = () =>
<div className='mb-4 mt-10 w-full px-2'>
<SearchButton
className='flex w-full items-center space-x-3 rounded-md border border-gray-300 bg-white px-3 py-1.5 text-left text-sm text-gray-700 shadow-sm transition-all duration-500 ease-in-out hover:border-secondary-500 hover:bg-secondary-100 hover:text-secondary-500'
indexName={DOCS_INDEX_NAME}
indexName={INDEX_NAME}
>
<IconLoupe />
<span className='flex-auto'>Search docs...</span>
Expand Down
4 changes: 2 additions & 2 deletions components/navigation/DocsNavWrapper.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import React from 'react';

import type { IDocsTree, IPost } from '@/types/post';

import { DOCS_INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import { INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import IconLoupe from '../icons/Loupe';
import DocsNav from './DocsNav';

Expand All @@ -25,7 +25,7 @@ export default function DocsNavWrapper({ setShowMenu, navigation, post }: IDocsN
<div className='flex flex-1 flex-col md:sticky md:top-20 md:max-h-(screen-14) md:overflow-y-auto'>
<SearchButton
className='mb-4 mr-2 mt-8 flex items-center space-x-3 rounded-md border border-gray-300 bg-white px-3 py-1.5 text-left text-sm text-gray-700 shadow-sm transition-all duration-500 ease-in-out hover:border-secondary-500 hover:bg-secondary-100 hover:text-secondary-500'
indexName={DOCS_INDEX_NAME}
indexName={INDEX_NAME}
>
{({ actionKey }) => (
<>
Expand Down
3 changes: 2 additions & 1 deletion components/navigation/MobileNavMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import React, { useState } from 'react';

import i18nextConfig from '@/next-i18next.config.cjs';

import { SearchButton } from '../AlgoliaSearch';
import { INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import IconLanguage from '../icons/Language';
import NavItemDropdown from '../icons/NavItemDropdown';
import SearchIcon from '../icons/SearchIcon';
Expand Down Expand Up @@ -67,6 +67,7 @@ export default function MobileNavMenu({
<SearchButton
className='flex items-center space-x-2 rounded-md p-2 text-left text-gray-400 transition duration-150 ease-in-out hover:bg-gray-100 hover:text-gray-500 focus:bg-gray-100 focus:text-gray-500 focus:outline-none'
aria-label='Open Search'
indexName={INDEX_NAME}
>
<SearchIcon />
</SearchButton>
Expand Down
4 changes: 3 additions & 1 deletion components/navigation/NavBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import React, { useEffect, useState } from 'react';

import { defaultLanguage, i18nPaths, languages } from '@/utils/i18n';

import { SearchButton } from '../AlgoliaSearch';
import { INDEX_NAME, SearchButton } from '../AlgoliaSearch';
import GithubButton from '../buttons/GithubButton';
import { isMobileDevice } from '../helpers/is-mobile';
import { useOutsideClick } from '../helpers/use-outside-click';
Expand Down Expand Up @@ -160,6 +160,7 @@ export default function NavBar({ className = '', hideLogo = false }: NavBarProps
<SearchButton
className='flex items-center space-x-2 rounded-md p-2 text-left text-gray-400 transition duration-150 ease-in-out hover:bg-gray-100 hover:text-gray-500 focus:bg-gray-100 focus:text-gray-500 focus:outline-none'
aria-label='Open Search'
indexName={INDEX_NAME}
>
<IconLoupe />
</SearchButton>
Expand Down Expand Up @@ -220,6 +221,7 @@ export default function NavBar({ className = '', hideLogo = false }: NavBarProps
<SearchButton
className='mr-2 flex items-center space-x-2 rounded-md p-2 text-left text-gray-400 transition duration-150 ease-in-out hover:bg-gray-100 hover:text-gray-500 focus:bg-gray-100 focus:text-gray-500 focus:outline-none'
aria-label='Open Search'
indexName={INDEX_NAME}
>
<IconLoupe />
</SearchButton>
Expand Down
Loading